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

В этой части учебника мы рассмотрим применение различных арифметических операторов в JavaScript на примере их использования с типом Number.

Терминология

Прежде, чем приступим к рассмотрению темы, стоит определиться немного с терминологией, которая будет использоваться нами в дальнейшем. Что касается термина «оператор», то с ним мы встречались и не один раз ещё в школе. Например, оператор сложения «+«, вычитания «-«, умножения «*» и так далее.

Операнд — это то, к чему применяется оператор. Например, в выражении 2 + 3 используется оператор сложения и два операнда: левый — это число 2 и правый — число 3. Также, операнды чато называют аргументами.

Исходя из этого определения, в JavaScript (и других языках программирования) все операторы делятся на две большие группы: унарные операторы и бинарные операторы. Унарные операторы применяются к одному операнду, а бинарные — к двум операндам. Например, в выражении 2 + 3 оператор + (плюс) — это бинарный оператор, так как применяется к двум операндам.

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

В JavaScript используются следующие бинарные математические операторы:

  1. Сложение +,
  2. Вычитание -,
  3. Умножение *,
  4. Деление /,
  5. Взятие остатка от деления %
  6. Возведение в степень **

Первые четыре операторы — известны нам ещё с начальной школы, поэтому их работу подробно говорить не будем, разве что, про + поговорим ниже. Подробнее остановимся на двух последних операторах — остатке от деления и возведении.

Остаток от деления (%)

Посмотрим на следующий пример:

let a = 5;
let b = 2;
console.log(a % b);//1

Результатом работы оператора % является остаток от целочисленного деления a на b. Так как наибольшее целое число, которое меньше или равно 5 и при этом делится без остатка на 2 равно 4, что и дает нам результат:  5 - 4 = 1. Стоит отметить, что в JavaScript оператор % может применяться к числам со знаком и дробным числам. Например, следующие выражения допустимы в JavaScript:

let a = 5.5 % 2;//1.5
let b = 2 % 3.5;//2

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

Возведение в степень (**)

Этот оператор возводит значение в степень, например,

let a = 5**2;//25
let b = 2**3;//8

При этом, оператор возведения в степень может использовать в качестве правого операнда дробные числа. Например, возведение в степень 1/2 эквивалентно взятию квадратного корня числа:

let a = 4 ** 1/2;//2

Унарные математические операторы JavaScript

  1. Инкремент ++
  2. Декремент --
  3. Унарный минус -
  4. Унарный плюс +

С этими операторами мы разберемся чуть подробнее.

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

Смысл этих операторов прост — увеличить на 1 (инкремент) или уменьшить на 1 (декремент) значение переменной. Например:

let a = 5;
a++;
console.log(a);//6

let b = 0;
b--;
console.log(b);//-1

Оба этих оператора имеют следующие особенности.

Первая особенность — операторы могут размещаться после переменной (постфиксная форма) или перед переменной (префиксная форма). Обе формы записи решают одну и ту же задачу, однако имеют свои особенности. Если используется постфиксная форма записи (как в примере выше), то вначале возвращается значение переменной, а затем — её значение увеличивается на 1, в префиксной форме вначале переменная увеличивается на 1, а затем возвращается её значение. Увидеть это различие можно на простом примере:

/*Пример постфиксного инкремента*/
let b = 0;
console.log(b--);//здесь b всё ещё равна 0
let c = b;
console.log(c);//а здесь с равна -1

при попытке вызова console.log() в консоль будет выведено старое значение переменной b, так как мы используем постфиксную форму оператора. Далее, мы объявляем переменную с, которой присваивается значение b, так как выше мы применили декремент к переменной b, то в этой строке переменная уже будет иметь значение не 0, а -1.

Теперь применим префиксную форму и посмотрим на результат:

let b = 0;
console.log(--b);//здесь b уже равна -1
let c = b;
console.log(c);//с принимает значение -1

здесь в консоль будет выведено дважды значение -1. Исходя из этих двух примеров можно сделать следующий вывод: если вам необходимо сразу получить новое значение переменной, то необходимо использовать префиксную форму записи оператора, если же вам не требуется сразу же новое значение переменной, то можно использовать постфиксную запись.

Вторая особенность — операторы инкремента и декремента можно использовать только по отношению к переменным. То есть, следующая запись приведет к ошибке:

5++;

В консоли мы увидим следующую ошибку:

Uncaught SyntaxError: Invalid left-hand side expression in postfix operation

Унарный минус

Унарный минус располагается строго слева от операнда и меняет его знак на противоположный. Например:

let b = 5;
let c = -b;
console.log(c);//-5

аналогично оператор работает и с отрицательными числами

let b = -5;
let c = -b;
console.log(c);//5

Унарный плюс

В отличие от унарного минуса, унарный плюс не меняет знак числа, а пытается конвертировать операнд в число. Например,

let b = "-5"; //здесь b - строка
let c = +b;
console.log(c-1);//-6

Если же переменную нельзя конвертировать в число, то результатов оператора будет значение NaN (Not a Number — не число):

let b = "один"; //здесь b - строка
let c = +b;
console.log(c);//NaN

Унарный плюс можно применять и к нечисловым типам данных, например:

let b = true; 
let c = false;
console.log(+b);//1
console.log(+c);//0

Возможно, что именно по причине незнания этого оператора связан мем про JavaScript в котором 3+3=33. Действительно, такую «хитрую» математику в JavaScript можно легко воспроизвести. Учитывая тот факт, что JS является языком с динамической типизацией, в более менее сложных программах с непривычки можно упустить из виду тип данных переменной и получить в коде что-то наподобие такого:

let b = "3"; 
let c = 3;
console.log(b + c);//33

так как один из операторов у нас строка, то JavaScript пытается не сложить числа, а объединить строки. В результате и получаем не 6, а 33. Такую ошибку можно исправить, используя оператор унарного плюса:

let b = 3; 
let c = "3";
console.log(b + +c);//6

Здесь вначале переменная с приводится к числу, а затем производится сложение. И после этого примера логично будет рассмотреть как бинарные операторы сложения и вычитания работают со строками.

Операторы сложения и вычитания в строках

Рассмотрим работу операторов на следующем примере:

/*Первый случай*/
let b = "5"; 
let c = "5";
console.log(b + c);//55

/*Второй случай*/
let b = 5; 
let c = "5";
console.log(b + c);//55

/*Третий случай*/
let b = 5; 
let c = "5";
console.log(b - c);//0

/*Четвертый случай*/
let b = "55"; 
let c = "5";
console.log(b - c);//50

В первом и втором случае используется оператор сложения. В этом случае, вне зависимости от того, какой из операндов является строкой — второй операнд также преобразуется в строку. Третий и четвертый случаи показывают как работает не только оператор вычитания, но и, в принципе, любой математический оператор отличный от бинарного оператора сложения — JavaScript будет пытаться преобразовать строку в число и затем выполнять операцию. Например,

let b = "55"; 
let c = "5";
console.log(++b / c);//11.2

здесь вначале значение переменной b преобразуется в число, затем это число увеличивается на 1, после этого переменная с преобразуется в число и, наконец, выполняется операция деления.

Можно также привести пример немного сложнее:

console.log(6 + 6 + "5");//125

Вопреки ожиданию получить 665, в консоль будет выведено значение 125 так как операции проводятся последовательно слева на право: вначале складываются два числа 6+6=12, затем значение преобразуется в строку и складывается со второй строкой «12»+»5″ = «125».

Итого

Сегодня мы рассмотрели основные математические операторы JavaScript и особенности их работы. Все операторы делятся на унарные — применяемые к одному операнду и бинарные — применяемые к двум операндам. Если при использовании бинарного оператора сложения хотя бы операнд является строкой, то второй операнд также будет преобразован в строку. Все остальные операторы, если они применяются к строкам, вначале пытаются преобразовать значение в число.  В дальнейшем мы продолжим рассматривать различные операторы JavaScript и особенности их работы.

Оставьте комментарий