Лекция
Привет, сегодня поговорим про основные операторы, обещаю рассказать все что знаю. Для того чтобы лучше понимать что такое основные операторы , настоятельно рекомендую прочитать все из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend).
++++, --Для работы с переменными, со значениями, JavaScript поддерживает все стандартные операторы, большинство которых есть и в других языках программирования.
У операторов есть своя терминология, которая используется во всех языках программирования.
5 * 2 — оператор умножения с левым и правым операндами. Другое название: «аргумент оператора»."-" меняет знак числа на противоположный:
1 |
var x = 1; |
2 |
alert( -x ); // -1, унарный минус |
3 |
alert( -(x+2) ); // -3, унарный минус применен к результату сложения x+2 |
4 |
alert( -(-3) ); // 3 |
1 |
var x = 1, y = 3; |
2 |
alert( y - x ); // 2, бинарный минус |
Работа унарного "+" и бинарного "+" в JavaScript существенно различается.
Это действительно разные операторы. Бинарный плюс складывает операнды, а унарный — ничего не делает в арифметическом плане, но зато приводит операнд к числовому типу. Далее мы увидим примеры.
Базовые арифметические операторы знакомы нам с детства: это плюс +, минус -, умножить *, поделить /.
Например:
1 |
alert(2 + 2); // 4 |
Или чуть сложнее:
1 |
var i = 2; |
2 |
3 |
i = (2 + i) * 3 / i; |
4 |
5 |
alert(i); // 6 |
Более редкий арифметический оператор % интересен тем, что никакого отношения к процентам не имеет. Его результат a % b — это остаток от деления a на b.
Например:
1 |
alert(5 % 2); // 1, остаток от деления 5 на 2 |
2 |
alert(8 % 3); // 2, остаток от деления 8 на 3 |
3 |
alert(6 % 3); // 0, остаток от деления 6 на 3 |
+Если бинарный оператор + применить к строкам, то он их объединяет в одну:
var a = "моя" + "строка"; |
alert(a); // моястрока |
Если хотя бы один аргумент является строкой, то второй будет также преобразован к строке!
Причем не важно, справа или слева находится операнд-строка, в любом случае нестроковый аргумент будет преобразован. Например:
1 |
alert( '1' + 2 ); // "12" |
2 |
alert( 2 + '1' ); // "21" |
Это приведение к строке — особенность бинарного оператора "+".
Остальные арифметические операторы работают только с числами и всегда приводят аргументы к числу.
Например:
1 |
alert( '1' - 2 ); // -1 |
2 |
alert( 6 / '2'); // 3 |
+Унарный плюс как арифметический оператор ничего не делает:
1 |
alert( +1 ); // 1 |
2 |
alert( +(1-2) ); // -1 |
Как видно, плюс ничего не изменил в выражениях. Результат — такой же, как и без него.
Тем не менее, он широко применяется, так как его «побочный эффект» — преобразование значения в число.
Например, у нас есть два числа, в форме строк, и нужно их сложить. Бинарный плюс сложит их как строки, поэтому используем унарный плюс, чтобы преобразовать к числу:
1 |
var a = "2"; |
2 |
var b = "3"; |
3 |
4 |
alert( a + b ); // "23", так как бинарный плюс складывает строки |
5 |
alert( +a + b ); // "23", второй операнд - все еще строка |
6 |
7 |
alert( +a + +b); // 5, число, так как оба операнда предварительно преобразованы в числа |
Оператор присваивания выглядит как знак равенства =:
var i = 1 + 2; |
alert(i); // 3 |
Он вычисляет выражение, которое находится справа, и присваивает результат переменной. Это выражение может быть достаточно сложным и включать в себя любые другие переменные:
1 |
var a = 1; |
2 |
var b = 2; |
3 |
4 |
a = b + a + 3; // (*) |
5 |
6 |
alert(a); // 6 |
В строке (*) сначала произойдет вычисление, использующее текущее значение a (т.е. 1), после чего результат перезапишет старое значение a.
Возможно присваивание по цепочке:
1 |
var a, b, c; |
2 |
3 |
a = b = c = 2 + 2; |
4 |
5 |
alert(a); // 4 |
6 |
alert(b); // 4 |
7 |
alert(c); // 4 |
Такое присваивание работает справа-налево, то есть сначала вычислятся самое правое выражение2+2, присвоится в c, затем выполнится b = c и, наконец, a = b.
"=" возвращает значениеВсе операторы возвращают значение. Об этом говорит сайт https://intellect.icu . Вызов x = выражение записывает выражение вx, а затем возвращает его. Благодаря этому присваивание можно использовать как часть более сложного выражения:
1 |
var a = 1; |
2 |
var b = 2; |
3 |
4 |
var c = 3 - (a = b + 1); |
5 |
6 |
alert(a); // 3 |
7 |
alert(c); // 0 |
В примере выше результатом (a = b + 1) является значение, которое записывается в a (т.е. 3). Оно используется для вычисления c.
Забавное применение присваивания, не так ли?
Знать, как это работает — стоит обязательно, а вот писать самому — только если вы уверены, что это сделает код более читаемым и понятным.
В том случае, если в выражении есть несколько операторов - порядок их выполнения определяетсяприоритетом.
Из школы мы знаем, что умножение в выражении 2 * 2 + 1 выполнится раньше сложения, т.к. егоприоритет выше, а скобки явно задают порядок выполнения. Но в JavaScript — гораздо больше операторов, поэтому существует целая таблица приоритетов.
Она содержит как уже пройденные операторы, так и те, которые мы еще не проходили. В ней каждому оператору задан числовой приоритет. Тот, у кого число меньше — выполнится раньше. Если приоритет одинаковый, то порядок выполнения — слева направо.
Отрывок из таблицы:
| … | … | … |
| 5 | умножение | * |
| 5 | деление | / |
| 6 | сложение | + |
| 6 | вычитание | - |
| 17 | присвоение | = |
| … | … | … |
Посмотрим на таблицу в действии.
В выражении x = 2 * 2 + 1 есть три оператора: присвоение =, умножение * и сложение +. Приоритет умножения * равен 5, оно выполнится первым, затем произойдет сложение +, у которого приоритет 6, и после них — присвоение =, с приоритетом 17.
++, --Одной из наиболее частых операций в JavaScript, как и во многих других языках программирования, является увеличение или уменьшение переменной на единицу.
Для этого существуют даже специальные операторы:
++ увеличивает на 1:
1 |
var i = 2; |
2 |
i++; // более короткая запись для i = i + 1. |
3 |
alert(i); // 3 |
-- уменьшает на 1:
1 |
var i = 2; |
2 |
i--; // более короткая запись для i = i - 1. |
3 |
alert(i); // 1 |
Инкремент/декремент можно применить только к переменной.
Код 5++ даст ошибку.
Вызывать эти операторы можно не только после, но и перед переменной: i++ (называется «постфиксная форма») или ++i («префиксная форма»).
Обе эти формы записи делают одно и то же: увеличивают на 1.
Тем не менее, между ними существует разница. Она видна только в том случае, когда мы хотим не только увеличить/уменьшить переменную, но и использовать результат в том же выражении.
Например:
1 |
var i = 1; |
2 |
var a = ++i; // (*) |
3 |
4 |
alert(a); // 2 |
В строке (*) вызов ++i увеличит переменную, а затем вернет ее значение в a. То есть, в a попадет значение i после увеличения.
Постфиксная форма i++ отличается от префиксной ++i тем, что возвращает старое значение, бывшее до увеличения.
В примере ниже в a попадет старое значение i, равное 1:
1 |
var i = 1; |
2 |
var a = i++; // (*) |
3 |
4 |
alert(a); // 1 |
1 |
var i = 0; |
2 |
i++; |
3 |
++i; |
4 |
alert(i); // 2 |
1 |
var i = 0; |
2 |
alert( ++i ); // 1 |
1 |
var i = 0; |
2 |
alert( i++ ); // 0 |
Инкремент/декремент можно использовать в любых выражениях.
При этом он имеет более высокий приоритет и выполняется раньше, чем арифметические операции:
1 |
var i = 1; |
2 |
alert( 2 * ++i ); // 4 |
1 |
var i = 1; |
2 |
alert( 2 * i++ ); // 2, выполнился раньше но значение вернул старое |
При этом, нужно с осторожностью использовать такую запись, потому что при чтении кода зачастую неочевидно, что переменая увеличивается. Три строки — длиннее, зато нагляднее:
1 |
var i = 1; |
2 |
alert( 2 * i ); |
3 |
i++; |
Побитовые операторы рассматривают аргументы как 32-разрядные целые числа и работают на уровне их внутреннего двоичного представления.
Эти операторы не являются чем-то специфичным для JavaScript, они поддерживаются в большинстве языков программирования.
Поддерживаются следующие побитовые операторы:
& )| )^ )~ )<< )>> )>>> )Вы можете более подробно почитать о них в отдельной статье Побитовые операторы.
Часто нужно применить оператор к переменной и сохранить результат в ней же, например:
var n = 2; |
n = n + 5; |
n = n * 2; |
Эту запись можно укоротить при помощи совмещенных операторов:+=, -=, *=, /=, >>=, <<=, >>>=, &=, |=, ^=.
Вот так:
1 |
var n = 2; |
2 |
n += 5; // теперь n=7 (работает как n = n + 5) |
3 |
n *= 2; // теперь n=14 (работает как n = n * 2) |
4 |
5 |
alert(n); // 14 |
Все эти операторы имеют в точности такой же приоритет, как обычное присваивание, то есть выполняются после большинства других операций.
Запятая тоже является оператором. Ее можно вызвать явным образом, например:
1 |
a = (5, 6); |
2 |
3 |
alert(a); |
Запятая позволяет перечислять выражения, разделяя их запятой ','. Каждое из них — вычисляется и отбрасывается, за исключением последнего, которое возвращается.
Запятая — единственный оператор, приоритет которого ниже присваивания. В выражении a = (5,6)для явного задания приоритета использованы скобки, иначе оператор '=' выполнился бы до запятой',', получилось бы (a=5), 6.
Зачем же нужен такой странный оператор, который отбрасывает значения всех перечисленных выражений, кроме последнего?
Обычно он используется в составе более сложных конструкций, чтобы сделать несколько действий в одной строке. Например:
1 |
// три операции в одной строке |
2 |
for (a = 1, b = 3, c = a*b; a < 10; a++) { |
3 |
... |
4 |
} |
Такие трюки используются во многих JavaScript-фреймворках для укорачивания кода.
К сожалению, в одной статье не просто дать все знания про основные операторы. Но я - старался. Если ты проявишь интерес к раскрытию подробностей,я обязательно напишу продолжение! Надеюсь, что теперь ты понял что такое основные операторы и для чего все это нужно, а если не понял, или есть замечания, то не стесняйся, пиши или спрашивай в комментариях, с удовольствием отвечу. Для того чтобы глубже понять настоятельно рекомендую изучить всю информацию из категории Выполнение скриптов на стороне клиента JavaScript, jqvery, JS фреймворки (Frontend)
Комментарии