Арифметические операторы

← предыдущая следующая →

Арифметические операторы принимают в качестве операндов числовые значения, выполняют с ними математические операции и возвращают результат в виде одного числового значения. Стандартные операторы — это сложение +, вычитание -, деление /, умножение *, деление с возвратом остатка %.

Перечень математических операторов

Арифметические (математические) операторы выполняют математические операции над операндами и возвращают результат. В JavaScript они такие же, как и в большинстве других языков программирования:

Оператор	Описание	Пример
+	Сложение	var x = 20 + 10; alert( x ); // 30
-	Вычитание	var x = 20 - 10; alert( x ); // 10
*	Умножение	var x = 20 * 10; alert( x ); // 200
/	Деление	var x = 20 / 10; alert( x ); // 2
%	Деление по модулю	var x = 5 % 2; alert( x ); // 1
++	Инкремент	var x = 10; x ++; alert( x ); // 11
--	Декремент	var x = 10; x--; alert( x ); // 9

Оператор сложения (+)

Бинарный оператор + возвращает сумму двух операндов, если они числовые. Возвращаемый результат будет формироваться по следующим правилам:

Слагаемые операнды	Результат
Один из слагаемых операндов — значение NaN	NaN
Суммируются операнды Infinity и Infinity	Infinity
Суммируются операнды -Infinity и -Infinity	-Infinity
Суммируются операнды Infinity и -Infinity	NaN
Суммируются операнды +0 и +0	+0
Суммируются операнды -0 и +0	+0
Суммируются операнды -0 и -0	-0

Если одним из операндов является строка, другой операнд автоматически преобразуется в строку и выполняется конкатенация (склеивание строк):

Выполнить код »

Невнимание к типам слагаемых операндов может привести к ошибке, например:

Выполнить код »

В этом примере предполагается, что алертом должна вывестись строка "Сумма 7 и 10 равна 17", однако в окне браузера выводится сообщение "Сумма 7 и 10 равна 710". Произошло это из-за того, что каждое сложение выполняется отдельно. Сначала строка "Сумма 7 и 10 равна " складывается с числом 7, что дает нам в результате строку. Затем к полученной строке прибавляется число 10, и снова у нас получается строка.

Чтобы сначала сложить числа, а затем присоединить полученный результат к строке, воспользуемся таблицей приоритетов операторов и просто добавим в выражение скобки:

Выполнить код »

Унарные плюс и минус

Унарные, то есть применённые к одному операнду, операторы плюс и минус известны нам ещё из математики и в JavaScript они работают точно так же.

Унарный плюс + преобразует свой операнд в число (или значение NaN) и возвращает преобразованное значение. Если операндом является число, то этот оператор ничего не делает:

Выполнить код »

Если унарный плюс + применяется к нечисловому аргументу, то проявляется его «побочный эффект» – преобразование значения в число. Он может конвертировать строковые представления чисел, а также нестроковые значения true, false и null. Если аргумент не может быть преобразован, возвращается NaN.

Следующий пример поясняет применение унарного оператора + к разным типам данных:

Выполнить код »

Унарный минус - указывается перед одиночным операндом и используется для изменения знака. Другими словами, он преобразует положительное значение в отрицательное, и наоборот. Если аргумент не является числом, то этот оператор пытается преобразовать его в число.

Выполнить код »

Оператор вычитания (-)

Бинарный оператор - выполняет вычитание второго операнда из первого. Если указаны нечисловые операнды, то оператор пытается преобразовать их в числа Возвращаемый результат будет формироваться по следующим правилам:

Операнды	Результат
Один из операндов — NaN	NaN
Infinity вычитается из Infinity	NaN
-Infinity вычитается из -Infinity	NaN
-Infinity вычитается из Infinity	Infinity
Infinity вычитается из -Infinity	-Infinity
+0 вычитается из +0	+0
-0 вычитается из +0	-0
-0 вычитается из -0	+0

Если один из аргументов – строка, faulse, true, null или undefined, он преобразуется в число с помощью функции Number(), а затем выполняется арифметическое вычитание по описанным правилам.

Рассмотрим несколько примеров использования этих правил:

Выполнить код »

Оператор умножение (*)

Оператор умножения * возвращает произведение операндов. Возвращаемый результат будет формироваться по следующим правилам:

Операнды	Результат
Все операнды — числа	±Number
Один из операндов — NaN	NaN
Infinity умножается на 0	NaN
Infinity умножается на число, отличное от 0	±Infinity
Infinity умножается на Infinity	Infinity

Если один из аргументов не является числом, он преобразуется в число с помощью функции Number(), а затем выполняется произведение по описанным правилам.

Выполнить код »

Оператор деление (/)

Оператор деления / производит деление его операндов, где левый операнд – делимый, а правый – делитель. Нечисловые аргументы интерпретатор JavaScript пытается преобразовать в числа. В JavaScript все числа вещественные, поэтому результатом любого деления является значение с плавающей точкой.

Выполнить код »

Деление по модулю (%)

Оператор деление по модулю % вычисляет остаток, получаемый при целочисленном делении левого операнда на правый. Возвращаемое значение всегда получает знак делимого, а не делителя. Оператор деления по модулю обычно применяется к целым операндам, но работает и для вещественных значений.

Допустим x и y — целые числа, причём y ≠ 0. Деление с остатком x («делимого») на y («делитель») означает нахождение таких целых чисел q и z, что выполняется равенство:

x/y = q+z

Таким образом, результатом деления с остатком являются два целых числа: q – неполное частное от деления, а z — остаток от деления. Нахождение остатка от деления называют взятием остатка или делением по модулю:

Выполнить код »

Инкремент (++)/декремент (--)

Инкремент ++ (от англ. increment «увеличение») — операция, увеличивающая переменную на единицу. Обратную операцию называют декремент -- («уменьшение»).

Возвращаемое значение оператора ++ зависит от его позиции относительно операнда. Если поставить его перед операндом (префиксный оператор инкремента), то к операнду прибавляется единица, а результатом является увеличенное значение операнда. Если же он размещается после операнда (постфиксный оператор инкремента), то к операнду прибавляется единица, однако результатом является первоначальное значение операнда.
Так:

var y = ++x

можно записать, как

x = x + 1;
var y = x;

В то время, как

var y = x++

эквивалентно

var y = x;
x = x + 1;

Рассмотрим различия между следующими двумя инструкциями:

Выполнить код »

Внимание: Операнд инкремента (++)/декремента (--) должен быть значением lval (т.е. переменной, элементом массива или свойством объекта). Код 7++ даст ошибку.

Декремент -- работает похоже, но в отличие от инкремента, вычитает единицу из числа.

Префиксный инкремент и декремент, согласно таблицы приоритетов, имеют в инструкциях одинаковый приоритет и выполняются слева направо, например:

Выполнить код »

Результат первого выражения равен 11 потому, что значение переменной x уменьшается на единицу перед сложением. Результат второго выражения также равен 11 потому, что складываются уже измененные значения операндов.

Постфиксный декремент --, как и инкремент, указывается после переменной и выполняется после вычисления инструкции, которая его содержит:

Выполнить код »

Результат первого выражения result1 равен 12 потому, что переменная x имеет первоначальное значение (2). Результат второго выражения result2 равен 11 потому, что здесь используется уже уменьшенное значение (1).

Применение: Постфиксная форма x++/x-- отличается от префиксной ++x/--x тем, что возвращает старое значение своего аргумента, бывшее до увеличения (уменьшения).

Итоги

Оператор сложения возвращает сумму числовых операндов или объединяет строки.
Унарный плюс широко используется для преобразование значения операнда в число.
Если используется постфиксная форма с оператором инкремента/декремента после операнда (x++/x--), то возвращается исходное значение операнда, а затем увеличивается/уменьшается на единицу.
Если используется префиксная форма с оператором инкремента/декремента перед операндом (++x/--x), значение операнда возвращается увеличенным/уменьшенным на единицу.

Задачи

Сложение чисел и строк

Имеется три переменные var a = 1, b = 2, c = " белых медведей". Сложите переменные так, чтобы в результате получилось выражение: "12 белых медведей".

Показать решение

Решение:

Вы уже знаете, что каждое сложение выполняется отдельно. Сначала строка " белых медведей" складывается с числом 2, что дает в результате строку. Далее к ней добавляется число 1, и опять получается строка.

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Сложение чисел и строк</title> </head> <body> <script> var a = 1, b = 2, c = " белых медведей"; document.write( 1 + (2 + " белых медведей") ); </script> </body> </html>

Выполнить код »

Префиксный и постфиксный инкремент

Какой результат будет получен в каждом примере?
(1)
```
var i = 2; 
i = i++; 
document.write( i ); 
```
(2)
```
i = 2; 
i = i++ + i++; 
document.write( i ); 
```
(3)
```
i = 2; 
i = i++ + ++i; 
document.write( i ); 
```
(4)
```
i = 2; 
i = ++i + ++i;
document.write( i ); 
```
Показать решение

Решение:

В первом примере, i = 2 + 1. Постфиксный инкремент не передает значение сразу. Ответ 2.

В втором примере приоритет у инкрементов, поэтому второй инкремент получает уже инкрементное значение, т.е. 3. Так как это постфиксные инкременты конечное выражение будет следующим: i = 2 + 3. Ответ 5.

В третьем примере операция похожа на второй, однако конечное выражение будет таким: i = 2 + 4. Здесь второй инкремент увеличивается дважды. Ответ 6.

В четвертом примере работают префиксные инкременты, т.е. сразу увеличиваются на единицу каждый. Как и в предыдущем примере второй инкремент увеличивается дважды, поэтому конечное выражение: i = 3 + 4. Ответ 7.

Инкремент и декремент

Запустив следующий код, вы получите число 16. Измените вторую строку так, чтобы получить число 15.
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Инкремент и декремент</title>
</head>
<body>
<script>

  var a = 5, b = 10, c;
  c = ++a + b--;
  document.write(c);

</script>  
</body>
</html>
```
Показать решение

Решение:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Инкремент и декремент</title> </head> <body> <script> var a = 5, b = 10, c; c = ++a + --b; document.write(c); </script> </body> </html>

Выполнить код »

Приоритет операторов

Запустив следующий код, вы получите число 30. Ваша задача расставить приоритетные скобки () так, чтобы получить число -390.
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Инкремент и декремент</title>
</head>
<body>
<script>

  var x = 15 * 4 + 25 - 55;
  document.write(x);

</script>  
</body>
</html>
```
Показать решение

Решение:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Приоритет операторов</title> </head> <body> <script> var x = 15 * ((4 + 25) - 55); document.write(x); </script> </body> </html>

Выполнить код »

Унарные операторы

1. Преобразуйте строковое значение переменной x в число, применив для этой цели унарный «плюс».
2. Уменьшите переменную на единицу при помощи декремента.
3. Сохраните значение в переменную result.
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Унарные операторы</title>
</head>
<body>
<script>

  var x = '5';
  /* ваш код */;
  document.write(result);

</script>  
</body>
</html>
```
Показать решение

Решение:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Унарные операторы</title> </head> <body> <script> var x = '5'; x = +x; var result = --x; document.write(result); </script> </body> </html>

Выполнить код »

← предыдущая следующая →

Приветствуются комментарии, соответствующие теме урока: вопросы, ответы, предложения.
Одну строчку кода оборачивайте в тег <code>, несколько строчек кода — в теги <pre><code>...ваш код...</code></pre>.
Допускаются ссылки на онлайн-песочницы (codepen, plnkr, JSBin и др.).

Арифметические операторы

Перечень математических операторов

Оператор сложения (+)

Унарные плюс и минус

Оператор вычитания (-)

Оператор умножение (*)

Оператор деление (/)

Деление по модулю (%)

Инкремент (++)/декремент (--)

Итоги

Задачи

Сложение чисел и строк

Префиксный и постфиксный инкремент

Инкремент и декремент

Приоритет операторов

Унарные операторы

Комментарии