Послание № 3
Операторы
Для работы с переменными, со значениями, с данными JavaScript поддерживает огромное количество операторов, большинство которых есть и в других языках программирования.
Несколько операторов мы знаем со школы и трудностей с ними не будет – это обычные сложение +, умножение *, вычитание и так далее, но есть и ряд особенных операторов, с которыми мы тоже должны познакомиться.
Термины: «унарный», «бинарный» и «операнд»
У операторов есть своя терминология, которая используется во всех языках программирования. И прежде чем мы продолжим изучение, мы должны с ними познакомится, чтобы понимать, о чем идет речь.
Операнд – то, к чему применяется оператор. Например: 5 * 2 – оператор умножения с левым и правым операндами.
Унарным называется оператор, который применяется к одному операнду. Например, оператор унарный минус " - " меняет знак числа на противоположный:
var x = 1;
x = -x;
alert(x); // -1, применили унарный минус
Бинарным называется оператор, который применяется к двум операндам. Тот же минус существует и в бинарной форме:
var x = 1, y = 3;
alert(y - x); // 2, бинарный минус
В данном пример минус относится и к левому и к правому операндам.
Приоритет
В том случае, если в выражении есть несколько операторов – порядок их выполнения определяется приоритетом.
Из школы мы знаем, что умножение в выражении 2 + 2 * 2 выполнится раньше сложения, т.к. его приоритет выше, а скобки явно задают порядок выполнения. Но в JavaScript – гораздо больше операторов, поэтому существует целая таблица приоритетов.
Она содержит как уже пройденные операторы, так и те, которые мы еще не проходили. В ней каждому оператору задан числовой приоритет. Тот, у кого число больше – выполнится раньше. Если приоритет одинаковый, то порядок выполнения – слева направо.
Отрывок из таблицы с основными операторами, которые нам сегодня понадобятся:
| Приоритет | Тип оператора | Ассоциативность | Операторы |
| Группировка | не определено | (…) | |
| Постфиксный инкремент | не определено | … ++ | |
| Постфиксный декремент | … -- | ||
| Унарный плюс | справа налево | + … | |
| Унарный минус | - … | ||
| Префиксный инкремент | ++ … | ||
| Префиксный декремент | -- … | ||
| typeof | typeof … | ||
| Умножение | слева направо | … * … | |
| Деление | … / … | ||
| Остаток | … % … | ||
| Сложение | слева направо | … + … | |
| Вычитание | … - … | ||
| Присваивание | справа налево | … = … | |
| … += … | |||
| … -= … | |||
| … **= … | |||
| … *= … | |||
| … %= … | |||
| Запятая / Последовательность | слева направо | …, … |
Оператор запятая
Запятая – единственный оператор, приоритет которого ниже присваивания. Обычно он используется в составе более сложных конструкций, чтобы сделать несколько действий в одной строке. Например:
let a = 1, b = 3, c = 40; // три операции в одной строке
Такие трюки используются JavaScript для укорачивания кода.
Обычные арифметические операторы
Обычные арифметические операторы (+,-,*,/), знакомы нам со школы и поэтому особого смысла их расписывать нет, единственный оператор, на который я хотел бы обратить внимание — это взятие остатка от деления (деление по модулю).
Взятие остатка %
Оператор взятия остатка % интересен тем, что, несмотря на обозначение, никакого отношения к процентам не имеет.
Его результат a % b – это остаток от деления a на b.
Например:
alert(5 % 2); // 1, остаток от деления 5 на 2
alert(8 % 3); // 2, остаток от деления 8 на 3
alert(6 % 3); // 0, остаток от деления 6 на 3
Присваивание
Обратим внимание, в таблице приоритетов также есть оператор присваивания =.
У него – один из самых низких приоритетов: 3.
Поэтому, когда переменную чему-либо присваивают, например, x = 2 + 2 * 2 сначала выполнится арифметика, а уже затем – произойдёт присваивание =.
var x = 2 * 2 + 1;
alert(x); // 5
Оператор "=" возвращает значение
Сокращённая арифметика с присваиванием
Очень часто в программе нужно применить оператор к переменной и сохранить результат в ней же, например:
var n = 2;
n = n + 5;
n = n * 2;
Эту запись можно укоротить при помощи совмещённых операторов, вот так:
var n = 2;
n += 5; // теперь n=7 (работает как n = n + 5)
n *= 2; // теперь n=14 (работает как n = n * 2)
alert(n); // 14
Так можно сделать для операторов +,-,*,/,% и бинарных <<,>>,>>>,&,|,^ (о них немного позже).
Вызов с присваиванием имеет в точности такой же приоритет, как обычное присваивание, то есть выполнится после большинства других операций:
var n = 2;
n *= 3 + 5;
alert(n); // 16 (n = 2 * 8)
Инкремент/декремент: ++, --
Одной из наиболее частых операций в JavaScript, как и во многих других языках программирования, является увеличение или уменьшение переменной на единицу. Чаще всего это используется в конструкции цикла.
Разработчики JS придумали для этих целей специальный оператор:
Инкремент ++ увеличивает на 1:
var i = 2;
i++; // более короткая запись для i = i + 1.
alert(i); // 3
Декремент -- уменьшает на 1:
var i = 2;
i--; // более короткая запись для i = i - 1.
alert(i); // 1
Важно:
Инкремент/декремент можно применить только к переменной. Код 5++ даст ошибку.
Вызывать эти операторы можно не только после, но и перед переменной: i++ (называется «постфиксная форма») или ++i («префиксная форма»).
Обе эти формы записи делают одно и то же: увеличивают на 1, но между ними существует разница. Она видна только в том случае, когда мы хотим не только увеличить/уменьшить переменную, но и использовать результат в том же выражении.
Например:
var i = 1;
var a = ++i; // (*)
alert(a); // 2
В этом примере вызов ++i (префиксная форма) увеличит переменную, а затем вернёт ее значение в переменную a. Так что в a попадёт значение i после увеличения.
Постфиксная форма i++ отличается от префиксной ++i тем, что возвращает старое значение, бывшее до увеличения.
В примере ниже в переменную a попадёт старое значение i, равное 1:
var i = 1;
var a = i++; // (*)
alert(a); // 1
Если результат оператора не используется, а нужно только увеличить/уменьшить переменную – без разницы, какую форму использовать:
var i = 0;
i++;
++i;
alert(i); // 2
Если хочется тут же использовать результат, то нужна префиксная форма:
var i = 0;
alert(++i); // 1
Если нужно увеличить, но нужно значение переменной до увеличения – постфиксная форма:
var i = 0;
alert(i++); // 0
Инкремент/декремент можно использовать в любых выражениях, при этом он имеет более высокий приоритет и выполняется раньше, чем арифметические операции.
Преобразование к числу, унарный плюс +, и методы
Унарный плюс, то есть применённый к одному значению, ничего не делает с числами с точки зрения арифметических операций.
Тем не менее, он широко применяется, так как его «побочный эффект» – преобразование значения в число.
Например, когда мы получаем значения из HTML-полей или от пользователя, то они обычно в форме строк.
А что, если их нужно, к примеру, сложить? Бинарный плюс сложит их как строки:
var apples = "2";
var oranges = "3";
alert(apples + oranges); // "23", так как бинарный плюс складывает строки
Поэтому используем унарный плюс, чтобы преобразовать к числу:
var apples = "2";
var oranges = "3";
alert(+apples + +oranges); // 5, число, оба операнда предварительно преобразованы в числа
С точки зрения математики такое изобилие плюсов может показаться странным. С точки зрения программирования – никаких разночтений: сначала выполнятся унарные плюсы, они приведут строки к числам, а затем – бинарный '+' их сложит.
Почему унарные плюсы выполнились до бинарного сложения? Все дело в их приоритете, он больше.