Expressions and operators
This chapter documents all the JavaScript language operators, expressions and keywords.
Expressions and operators by category
For an alphabetical listing see the sidebar on the left.
Primary expressions
Basic keywords and general expressions in JavaScript. These expressions have the highest precedence (higher than operators).
The this keyword refers to a special property of an execution context.
Basic null , boolean, number, and string literals.
Array initializer/literal syntax.
Object initializer/literal syntax.
The function keyword defines a function expression.
The class keyword defines a class expression.
The function* keyword defines a generator function expression.
The async function defines an async function expression.
The async function* keywords define an async generator function expression.
Regular expression literal syntax.
Template literal syntax.
Left-hand-side expressions
Left values are the destination of an assignment.
Member operators provide access to a property or method of an object ( object.property and object[«property»] ).
The optional chaining operator returns undefined instead of causing an error if a reference is nullish ( null or undefined ).
The new operator creates an instance of a constructor.
In constructors, new.target refers to the constructor that was invoked by new .
An object exposing context-specific metadata to a JavaScript module.
The super keyword calls the parent constructor or allows accessing properties of the parent object.
The import() syntax allows loading a module asynchronously and dynamically into a potentially non-module environment.
Increment and decrement
Postfix/prefix increment and postfix/prefix decrement operators.
Postfix increment operator.
Postfix decrement operator.
Prefix increment operator.
Prefix decrement operator.
Unary operators
A unary operation is an operation with only one operand.
The delete operator deletes a property from an object.
The void operator evaluates an expression and discards its return value.
The typeof operator determines the type of a given object.
The unary plus operator converts its operand to Number type.
The unary negation operator converts its operand to Number type and then negates it.
Bitwise NOT operator.
Logical NOT operator.
Pause and resume an async function and wait for the promise’s fulfillment/rejection.
Arithmetic operators
Arithmetic operators take numerical values (either literals or variables) as their operands and return a single numerical value.
Relational operators
A comparison operator compares its operands and returns a boolean value based on whether the comparison is true.
Less than operator.
Greater than operator.
Less than or equal operator.
Greater than or equal operator.
The instanceof operator determines whether an object is an instance of another object.
The in operator determines whether an object has a given property.
Note: => is not an operator, but the notation for Arrow functions.
Equality operators
The result of evaluating an equality operator is always of type boolean based on whether the comparison is true.
Strict equality operator.
Strict inequality operator.
Bitwise shift operators
Operations to shift all bits of the operand.
Bitwise left shift operator.
Bitwise right shift operator.
Bitwise unsigned right shift operator.
Binary bitwise operators
Bitwise operators treat their operands as a set of 32 bits (zeros and ones) and return standard JavaScript numerical values.
Binary logical operators
Logical operators implement boolean (logical) values and have short-circuiting behavior.
Nullish Coalescing Operator.
Conditional (ternary) operator
The conditional operator returns one of two values based on the logical value of the condition.
Assignment operators
An assignment operator assigns a value to its left operand based on the value of its right operand.
Left shift assignment.
Right shift assignment.
Unsigned right shift assignment.
Bitwise AND assignment.
Bitwise XOR assignment.
Bitwise OR assignment.
Logical AND assignment.
Logical OR assignment.
Nullish coalescing assignment.
Destructuring assignment allows you to assign the properties of an array or object to variables using syntax that looks similar to array or object literals.
Yield operators
Pause and resume a generator function.
Delegate to another generator function or iterable object.
Spread syntax
Spread syntax allows an iterable, such as an array or string, to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected. In an object literal, the spread syntax enumerates the properties of an object and adds the key-value pairs to the object being created.
Comma operator
The comma operator allows multiple expressions to be evaluated in a single statement and returns the result of the last expression.
Выражения и операторы
Эта глава описывает выражения и операторы языка JavaScript, такие как операторы присваивания, сравнения, арифметические, битовые, логические, строчные, и различные специальные операторы.
Полный и детальный список операторов и выражений также доступен в этом руководстве.
Операторы
В JavaScript есть следующие типы операторов. Данный подраздел описывает каждый тип и содержит информацию об их приоритетах друг над другом.
JavaScript поддерживает бинарные и унарные операторы, а также ещё один специальный тернарный оператор — условный оператор. Бинарная операция использует два операнда, один перед оператором и другой за ним:
Например: 3+4 или x*y .
В свою очередь унарная операция использует один операнд, перед или после оператора:
Например: x++ или ++x .
Операторы присваивания
В результате операции присваивания операнду слева от оператора присваивания (en-US) (знак » table-container»>
| Имя | Сокращённый оператор | Смысл |
|---|---|---|
| Присваивание (en-US) | x = y | x = y |
| Присваивание со сложением (en-US) | x += y | x = x + y |
| Присваивание с вычитанием (en-US) | x -= y | x = x — y |
| Присваивание с умножением (en-US) | x *= y | x = x * y |
| Присваивание с делением (en-US) | x /= y | x = x / y |
| Присваивание по модулю (en-US) | x %= y | x = x % y |
| Присваивание с левым сдвигом (en-US) | x <<= y | x = x << y |
| Присваивание с правым сдвигом (en-US) | x >>= y | x = x >> y |
| Присваивание с беззнаковым сдвигом вправо (en-US) | x >>>= y | x = x >>> y |
| Присваивание с побитовым AND (en-US) | x &= y | x = x & y |
| Присваивание с побитовым XOR (en-US) | x ^= y | x = x ^ y |
| Присваивание с побитовым OR (en-US) | x |= y | x = x | y |
Деструктуризация
Для более сложного присваивания в JavaScript есть синтаксис деструктуризации — это выражение, которое позволяет извлекать данные из массивов или объектов, используя синтаксис, который зеркалирует конструкторы массивов и литералы объектов.
Операторы сравнения
Оператор сравнения (en-US) сравнивает свои операнды и возвращает логическое значение, базируясь на истинности сравнения. Операнды могут быть числами, строками, логическими величинами или объектами. Строки сравниваются на основании стандартного лексикографического порядка, используя Unicode-значения. В большинстве случаев, если операнды имеют разный тип, то JavaScript пробует преобразовать их в тип, подходящий для сравнения. Такое поведение обычно происходит при сравнении числовых операндов. Единственным исключением из данного правила является сравнение с использованием операторов === и !== , которые производят строгое сравнение на равенство или неравенство. Эти операторы не пытаются преобразовать операнды перед их сравнением. Следующая таблица описывает операторы сравнения в контексте следующего примера кода:
| Оператор | Описание | Примеры, возвращающие true |
|---|---|---|
| Равно ( == ) | Возвращает true, если операнды равны. | 3 == var1 «3» == var1 3 == ‘3’ |
| Не равно ( != ) | Возвращает true, если операнды не равны. | var1 != 4 var2 != «3» |
| Строго равно ( === ) | Возвращает true, если операнды равны и имеют одинаковый тип. Смотрите также Object.is и sameness in JS. | 3 === var1 |
| Строго не равно( !== ) | Возвращает true, если операнды не равны и/или имеют разный тип. | var1 !== «3» 3 !== ‘3’ |
| Больше ( > ) | Возвращает true, если операнд слева больше операнда справа. | var2 > var1 «12» > 2 |
| Больше или равно ( >= ) | Возвращает true, если операнд слева больше или равен операнду справа. | var2 >= var1 var1 >= 3 |
| Меньше ( < ) | Возвращает true, если операнд слева меньше операнда справа. | var1 < var2 «2» < 12 |
| Меньше или равно ( <= ) | Возвращает true, если операнд слева меньше или равен операнду справа. | var1 <= var2 var2 <= 5 |
Примечание: (=>) не оператор, а нотация Стрелочных функций.
Арифметические операторы
Арифметические операторы (en-US) используют в качестве своих операндов числа (также литералы или переменные) и в качестве результата возвращают одно числовое значение. Стандартными арифметическими операторами являются сложение (+), вычитание (-), умножение (*), и деление (/). При работе с числами с плавающей точкой эти операторы работают аналогично их работе в большинстве других языках программирования (обратите внимание, что деление на ноль возвращает бесконечность Infinity ). Например:
Кроме того, JavaScript позволяет использовать следующие арифметические операторы, представленные в таблице:
| Оператор | Описание | Пример |
|---|---|---|
| Остаток от деления (en-US) ( % ) | Бинарный оператор. Возвращает целочисленный остаток от деления двух операндов. | 12 % 5 вернёт 2. |
| Инкремент (en-US) ( ++ ) | Унарный оператор. Добавляет единицу к своему операнду. Если используется в качестве префикса ( ++x ), то возвращает значение операнда с добавленной к нему единицей; а в случае применения в качестве окончания ( x++ ) возвращает значение операнда перед добавлением к нему единицы. | Если x равно 3, тогда ++x установит значение x равным 4 и вернёт 4, напротив x++ вернёт 3 и потом установит значение x равным 4. |
| Декремент (en-US) ( — ) | Унарный оператор. Вычитает единицу из значения своего операнда. Логика данного оператора аналогична оператору инкремента. | Если x равно 3, тогда —x установит значение x равным 2 и вернёт 2, напротив x— вернёт 3 и потом установит значение x равным 2. |
| Унарный минус (en-US) — | Унарный оператор. Возвращает отрицательное значение своего операнда. | Если x равно 3, тогда -x вернёт -3. |
| Унарный плюс (en-US) ( + ) | Унарный оператор. Пытается конвертировать операнд в число, если он ещё не оно. | +»3″ вернёт 3 . +true вернёт 1. |
| Возведение в степень (en-US) ( ** ) Экспериментальная возможность | Возводит основание в показатель степени , как, основаниестепень | 2 ** 3 вернёт 8 . 10 ** -1 вернёт 0.1 . |
Битовые (поразрядные) операторы
Битовые операторы (en-US) обрабатывают свои операнды как последовательности из 32 бит (нулей и единиц), а не как десятичные, шестнадцатеричные или восьмеричные числа. Например, десятичное число 9 имеет двоичное представление 1001. Битовые операторы выполняют операции над таким двоичным представлением, но результат возвращают как обычное числовое значение JavaScript.
Следующая таблица обобщает битовые операторы JavaScript.
Битовые логические операторы
Основной смысл работы битовых логических операторов состоит в следующем:
-
Операнды преобразуются в 32-битные целые числа и представляются в виде последовательности бит (нулей и единиц). Числа, имеющие более 32 битов будут сокращены. Например, следующее число имеет больше 32 битов и сконвертируется в 32-х битное:
Например, двоичным представлением числа 9 является 1001, а двоичным представлением пятнадцати — 1111. Результаты применения к этим числам битовых логических операторов выглядят следующим образом:
Обратите внимание, что все 32 бита преобразуются с использованием битового оператора НЕ, и что величины с наиболее значимым (самым левым) битом равным 1 представляют собой отрицательные числа (в представлении дополнения до двух).
Битовые операторы сдвига
Битовые операторы сдвига используют два операнда: первый представляет величину, подлежащую сдвигу, а второй операнд указывает число битовых позиций на которое должен быть сдвинут первый операнд. Направление операции сдвига определяется используемым оператором.
Операторы сдвига преобразуют свои операнды в 32-битные целые числа и возвращают результат того же типа, каким является левый операнд.
Операторы сдвига перечислены в следующей таблице.
| Оператор | Описание | Пример |
|---|---|---|
| [Сдвиг влево](</ru/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#<<_(Left_shift)>) ( << ) | Данный оператор сдвигает первый операнд на указанное количество бит влево. Излишние биты, сдвинутые влево, отбрасываются. Справа число дополняется нулевыми битами. | 9<<2 равно 36, так как 1001 после сдвига на 2 бита влево превращается в 100100, что соответствует числу 36. |
| [Сдвиг вправо с переносом знака](</ru/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#>>_(Sign-propagating_right_shift)>) ( >> ) | Данный оператор сдвигает первый операнд на указанное количество бит вправо. Излишние биты, сдвинутые вправо, отбрасываются. Слева число дополняется копиями крайнего слева бита. | 9>>2 равно 2, так как 1001 после сдвига на 2 бита вправо превращается в 10, что соответствует числу 2. Подобным же образом -9>>2 равно -3, так как знак сохраняется. |
| [Сдвиг вправо с заполнением нулями](</ru/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#>>>_(Zero-fill_right_shift)>) ( >>> ) | Данный оператор сдвигает первый операнд на указанное количество бит вправо. Излишние биты, сдвинутые вправо, отбрасываются. Слева число дополняется нулевыми битами. | 19>>>2 равно 4, так как 10011 после сдвига на 2 бита вправо превращается в 100, что соответствует числу 4. Для неотрицательных чисел сдвиг вправо с заполнением нулями и сдвиг вправо с переносом знака дают одинаковый результат. |
Логические операторы
Логические операторы (en-US) обычно используются с булевыми (логическими) значениями; при этом возвращаемое ими значение также является булевым. Однако операторы && и || фактически возвращают значение одного из операндов, поэтому, если эти операторы используются с небулевыми величинами, то возвращаемая ими величина также может быть не булевой. Логические операторы описаны в следующей таблице.
| Оператор | Использование | Описание |
|---|---|---|
| Логическое И (en-US) «( && ) | expr1 && expr2 | (Логическое И) Возвращает операнд expr1 , если он может быть преобразован в false ; в противном случае возвращает операнд expr2 . Таким образом, при использовании булевых величин в качестве операндов, оператор && возвращает true , если оба операнда true ; в противном случае возвращает false . |
| Логическое ИЛИ (en-US) ( || ) | expr1 || expr2 | (Логическое ИЛИ) Возвращает операнд expr1 , если он может быть преобразован в true ; в противном случае возвращает операнд expr2 . Таким образом, при использовании булевых величин в качестве операндов, оператор || возвращает true , если один из операндов true ; если же оба false , то возвращает false . |
| Логическое НЕ (en-US) ( ! ) | !expr | (Логическое НЕ) Возвращает false , если операнд может быть преобразован в true ; в противном случае возвращает true . |
Примерами выражений, которые могут быть преобразованы в false являются: null, 0, NaN, пустая строка («») или undefined.
Следующий код демонстрирует примеры использования оператора && (логическое И).
Следующий код демонстрирует примеры использования оператора || (логическое ИЛИ).
Следующий код демонстрирует примеры использования оператора ! (логическое НЕ).
Сокращённая оценка
Так как логические выражения вычисляются слева направо, они проверяются на возможность выполнения сокращённой оценки с использованием следующих правил:
- false && anything — сокращение с результатом false.
- true || anything — сокращение с результатом true.
Правила логики гарантируют, что данные вычисления всегда корректны. Обратите внимание, что часть «anything» представленных выше выражений не вычисляется, таким образом удаётся избежать любых побочных эффектов вычисления данной части.
Строковые операторы
В дополнение к операторам сравнения, которые могут использоваться со строковыми значениями, оператор (+) позволяет объединить две строки, возвращая при этом третью строку, которая представляет собой объединение двух строк-операндов:
Сокращённый оператор присваивания += также может быть использован для объединения (конкатенации) строк:
Условный (тернарный) оператор
Условный оператор является единственным оператором JavaScript, который использует три операнда. Оператор принимает одно из двух значений в зависимости от заданного условия. Синтаксис оператора:
Предупреждение: val1 и val2 обязательно должны что-то возвращать, поэтому в этой конструкции нельзя использовать continue или break
Если condition (условие) — истина, то оператор принимает значение val1 . В противном случае оператор принимает значение val2 . Вы можете использовать условный оператор во всех случаях, где может быть использован стандартный оператор.
Данное выражение присваивает значение «adult» переменной status , если age имеет значение 18 или более. В противном случае переменной status присваивается значение «minor».
Оператор запятая
Оператор запятая ( , ) просто вычисляет оба операнда и возвращает значение последнего операнда. Данный оператор в основном используется внутри цикла for , что позволяет при каждом прохождении цикла одновременно обновлять значения нескольких переменных.
Например, если a является двумерным массивом, каждая строка которого содержит 10 элементов, то следующий код с использованием оператора запятая позволяет выполнять одновременное приращение двух переменных. Данный код выводит на экран значения диагональных элементов массива:
Унарные операторы
Унарная операция — операция только с одним операндом.
delete
Оператор delete выполняет удаление объекта, свойства объекта, или элемента массива с заданным индексом. Синтаксис оператора:
где objectName представляет собой имя объекта, property — свойство объекта, а index — целое число, указывающее на положение (номер позиции) элемента в массиве.
Четвёртый вариант использования позволяет удалить свойство объекта, но допускается только внутри with .
Вы можете использовать оператор delete для удаления переменных, объявленных неявно, но вы не можете с его помощью удалять переменные, объявленные с помощью var .
После применения оператора delete свойство элемента меняется на undefined . Оператор delete возвращает true если выполнение операции возможно; оператор возвращает false , если выполнение операции невозможно.
Удаление элементов массива
Удаление элемента массива не влияет на длину массива. Например, если вы удалите a[3] , элемент a[4] останется a[4], a[3] станет undefined.
Когда элемент массива удаляется с помощью оператора delete , то из массива удаляется значение данного элемента. В следующем примере элемент trees[3] удалён с помощью оператора delete . Однако, элемент trees[3] остаётся адресуемым и возвращает значение undefined .
Если вы хотите, чтобы элемент оставался в массиве, но имел значение undefined, то используйте ключевое слово undefined вместо оператора delete . В следующем примере элементу trees[3] присвоено значение undefined , но элемент при этом остаётся в массиве:
Оператор typeof
Оператор typeof используется одним из следующих способов:
Оператор typeof возвращает строку обозначающую тип невычисленного операнда. Значение operand может быть строкой, переменной, дескриптором, или объектом, тип которого следует определить. Скобки вокруг операнда необязательны.
Предположим, вы определяете следующие переменные:
Оператор typeof возвращает следующие результаты для этих переменных:
Для дескрипторов true и null оператор typeof возвращает следующие результаты:
Для чисел и строк оператор typeof возвращает следующие результаты:
Для свойств оператор typeof возвращает тип значения данного свойства:
Для методов и функций оператор typeof возвращает следующие результаты:
Для встроенных объектов оператор typeof возвращает следующие результаты:
Оператор void
Оператор void используется любым из следующих способов:
Оператор void определяет выражение, которое должно быть вычислено без возвращения результата. expression — это выражение JavaScript, требующее вычисления. Скобки вокруг выражения необязательны, но их использование является правилом хорошего тона.
Вы можете использовать оператор void для указания на то, что операнд-выражение является гипертекстовой ссылкой. При этом выражение обрабатывается, но не загружается в текущий документ.
Следующий код служит примером создания гипертекстовой ссылки, которая бездействует при нажатии на неё пользователем. Когда пользователь нажимает на ссылку, void(0) вычисляется равным undefined , что не приводит ни к каким действиям в JavaScript.
Приведённый ниже код создаёт гипертекстовую ссылку, которая подтверждает отправку формы при клике на ней пользователем:
Операторы отношения
Оператор отношения сравнивает свои операнды и возвращает результат сравнения в виде булева значения.
Оператор in
Оператор in возвращает true, если указанный объект имеет указанное свойство. Синтаксис оператора:
где propNameOrNumber — строка или числовое выражение, представляющее имя свойства или индекс массива, а objectName — имя объекта.
Некоторые примеры способов использования оператора in :
Оператор instanceof
Оператор instanceof возвращает true, если заданный объект является объектом указанного типа. Его синтаксис:
где objectName — имя объекта, тип которого необходимо сравнить с objectType , а objectType — тип объекта, например, Date или Array .
Используйте оператор instanceof , когда вам необходимо подтвердить тип объекта во время выполнения программы. Например, при перехвате исключений вы можете создать различные программные переходы для обработки исключений в зависимости от типа обрабатываемого исключения.
Например, следующий код использует оператор instanceof для проверки того, является ли объект theDay объектом типа Date . Так как theDay действительно является объектом типа Date , то программа выполняет код, содержащийся в утверждении if .
Приоритет операторов
Приоритет операторов определяет порядок их выполнения при вычислении выражения. Вы можете влиять на приоритет операторов с помощью скобок.
Приведённая ниже таблица описывает приоритет операторов от наивысшего до низшего.
Более подробная версия данной таблицы, содержащая ссылки и дополнительную информацию по каждому оператору, находится в справочнике JavaScript.
Выражения
Выражением является любой корректный блок кода, который возвращает значение.
Концептуально, существуют два типа выражений: те которые присваивают переменной значение, и те, которые вычисляют значение без его присваивания.
Выражение x = 7 является примером выражения первого типа. Данное выражение использует оператор = для присваивания переменной x значения 7. Само выражение также равняется 7.
Код 3 + 4 является примером выражения второго типа. Данное выражение использует оператор «+» для сложения чисел 3 и 4 без присваивания переменной полученного результата 7.
Все выражения в JavaScript делятся на следующие категории:
- Арифметические: вычисляются в число, например: 3.14159 (Используют арифметические операторы).
- Строковые: вычисляются в текстовую строку, например: «Fred» или «234» (Используют строковые операторы).
- Логические: вычисляются в true или false (Используют логические операторы).
- Основные выражения: Базовые ключевые слова и основные выражения в JavaScript.
- Левосторонние выражения: Значениям слева назначаются значения справа.
Основные выражения
Базовые ключевые слова и основные выражения в JavaScript.
Оператор this
Используйте ключевое слово this для указания на текущий объект. В общем случае this указывает на вызываемый объект, которому принадлежит данный метод. Используйте this следующим образом:
Предположим, функция validate выполняет проверку свойства value некоторого объекта; задан объект, а также верхняя и нижняя граница величины данного свойства:
Вы можете вызвать функцию validate для обработчика события onChange для каждого элемента формы, используя this для указания на элемент формы, как это показано в следующем примере:
Оператор группировки
Оператор группировки «скобки» ( ) контролирует приоритет вычисления выражений. Например, вы можете переопределить порядок — «умножение и деление, а потом сложение и вычитание», так чтобы, например, чтобы сложение выполнялось до умножения:
Упрощённый синтаксис создания массивов и генераторов
Упрощённый синтаксис — экспериментальная возможность JavaScript, которая возможно будет добавлена в будущие версии ECMAScript. Есть 2 версии синтаксиса:
Упрощённый синтаксис для массивов.
Упрощённый синтаксис для генераторов.
Упрощённые синтаксисы существуют во многих языках программирования и позволяют вам быстро собирать новый массив, основанный на существующем. Например:
Левосторонние выражения
Значениям слева назначаются значения справа.
Вы можете использовать оператор new для создания экземпляра объекта пользовательского типа или одного из встроенных объектов. Используйте оператор new следующим образом:
super
Ключевое слово используется, чтобы вызывать функции родительского объекта. Это полезно и с классами для вызова конструктора родителя, например.
Оператор расширения
Оператор расширения позволяет выражению расширяться в местах с множеством аргументов (для вызовов функций) или множестве элементов (для массивов).
Пример: Сегодня, если у вас есть массив и вы хотите создать новый с существующей частью первого, то литерального синтаксиса массива уже не достаточно, и вы должны писать императивный (без вариантов) код, используя комбинацию push , splice , concat и т.д. Но с этим оператором код становится более коротким:
An Easy Guide to Operators in JavaScript
In the last article we looked at the types that JavaScript has to offer. But what we didn’t talk about is their operators, basically what make a value act on or be acted on to produce a result. These includes but not limited to +(plus), -(minus) etc., and you might be thinking can a string type have an operator, well that answer is a resounding yes.
Note: These are not standardize(official), it is just my own way of trying to structure it.
Categories of Operator
There are three categories of operators in JavaScript
- Unary Operator
- Binary Operator
- Ternary Operator
These are majorly due to their functionality on other, how they behave.
Note: NOT ALL OPERATORS ARE SYMBOLS
Unary Operators
These are operators that act on an operand(value) i.e they act on a single value. Example typeof , —(minus sign), !(exclamation mark) etc. The typeof keyword produces a string value naming the type of the value you provide it.
Binary Operators
These are operators that act on two operands(values). This is where most of all operators fall into. They are common, some of which you might know. Example +(plus), -(minus).
Ternary Operator
These are operators that operate on three operands(values). It is likely this is not the first time you have heard of this term. Try to guess it… Yep it is the question mark(?) and the colon(:). As for now it is the only operator that has such functionality, we will know how it operates later on in the article.
Types of Operators
I will be discussing the following operators below. These are not the only types of operators
- Arithmetic
- Logical
- Comparison
- Conditional
Arithmetic
These are operators that perform arithmetic operation. These includes Addition(+), Subtraction(-), Division(/), Multiplication(*). If you have done basic math these symbols and their meaning are known to you, but there are other arithmetic symbols that have functionalities that you don’t know about.
Strings can also use the + symbol. This is called concatenation.
For instance if you want to find a remainder of a division operation or if you want an integer(whole number) from a floating-point number(decimal number, JavaScript doesn’t have this type). Well wait no further, I introduce the Modulus(%) and Floor(//) operation.
The Floor operator which is a double forward slash(//), basically ignores any value after the decimal place, irrespective of whether the value is over .5 or less than than .5.
The Modulus operator which is a percent(%) sign, returns the remainder of the division operation. This can be useful when you want to know if a number is an even number or an odd number.
Logical Operators
These operator that operate on boolean values. They include and, or and, not. Well in JavaScript they are represented in symbols. So and(&&), or (||), not (!).
The && operator represents logical and. It is a binary operator(i.e operates on two values), and its result is true only if both the values given to it are true.
Comparison Operator
The > and < signs are the traditional symbols for “is greater than” and “is
less than”, respectively. They are binary operators. Applying them results in
a Boolean value that indicates whether they hold true in this case.
Strings can be compared in the same way.
Conditional Operator
This operator is a ternary(operating on three values). It is written with a question and a colon. So the way it works is if it is true the value before the colon(:) and after the question mark(?) will be returned, if false the value after the colon will be returned.
It is like an easy way to write a conditional statement which doesn’t have any other conditions.
Automatic Type Conversion
JavaScript goes out of its way to accept almost any program you give it, event program that do odd things.
When an operator is applied to the “wrong” type of value, JavaScript will
silently convert that value to the type it needs, using a set of rules that often
aren’t what you want or expect. This is called type conversion. When something that doesn’t map to a number in an obvious way (such as
“five” or undefined) is converted to a number, you get the value NaN.
When using == to compare values of the same type, the outcome is easy to
predict. The result should give you true if both values are the same, except in the case of NaN. But when the types differ, JavaScript uses a complicated and confusing set of rules to determine what to do. In most cases, it just tries to convert one of the values to the other value’s type. However, when null or undefined occurs on either side of the operator, it produces true only if both sides are one of null or undefined.
Short-circuiting
The logical operators && and || handle values of different types in a peculiar
way. They will convert the value on their left side to Boolean type in order
to decide what to do, but depending on the operator and the result of that
conversion, they will return either the original left-hand value or the right-hand value.
The || operator will return the value to the left when true and return the right when false.
This doesn’t work for boolean values, but for other values. The rules for converting strings and numbers to Boolean values state that 0, null, undefined, empty string, NaN count as false, while others count as true.
The && operator will return the value to the right when true and return the left when false.
This is useful when you have a variable that is dynamically set, in case the value is an empty string, null, or undefined which all evaluates to a falsy; the value to the right will be the default value.
“A falsy (sometimes written falsey) value is a value that is considered false when encountered in a Boolean context.” — Mozilla Developer Network
When a value evaluates to true it is regarded as truthy, if otherwise it is regarded as falsy. It is colloquial term so, it is not a technical term. Values that evaluates to falsy are 0,0n(Bigint), null, NaN, false, undefined and empty string(“”).
There are types of operators that were not covered in this article, but you can find here. Also precedence in operators is also a thing, so make sure you know about them to prevent unintended bugs
Summary
We have learnt about the operators of JavaScript, based on how many operand they act on
- Unary Operator
- Binary Operator
- Ternary Operator
Based on types they act on
- Arithmetic
- Logical
- Comparison
- Conditional
Also we look at Short circuiting and Automatic Conversion. So be careful of Automatic Conversion it is an avenue to introduce bugs.
Базовые операторы, математика
Многие операторы знакомы нам ещё со школы: сложение + , умножение * , вычитание — и так далее.
В этой главе мы начнём с простых операторов, а потом сконцентрируемся на специфических для JavaScript аспектах, которые не проходят в школьном курсе арифметики.
Термины: «унарный», «бинарный», «операнд»
Прежде, чем мы двинемся дальше, давайте разберёмся с терминологией.
Операнд – то, к чему применяется оператор. Например, в умножении 5 * 2 есть два операнда: левый операнд равен 5 , а правый операнд равен 2 . Иногда их называют «аргументами» вместо «операндов».
Унарным называется оператор, который применяется к одному операнду. Например, оператор унарный минус "-" меняет знак числа на противоположный:
Бинарным называется оператор, который применяется к двум операндам. Тот же минус существует и в бинарной форме:
Формально, в последних примерах мы говорим о двух разных операторах, использующих один символ: оператор отрицания (унарный оператор, который обращает знак) и оператор вычитания (бинарный оператор, который вычитает одно число из другого).
Математика
Поддерживаются следующие математические операторы:
- Сложение + ,
- Вычитание — ,
- Умножение * ,
- Деление / ,
- Взятие остатка от деления % ,
- Возведение в степень ** .
Первые четыре оператора очевидны, а про % и ** стоит сказать несколько слов.
Взятие остатка %
Оператор взятия остатка % , несмотря на обозначение, никакого отношения к процентам не имеет.
Результат a % b – это остаток от целочисленного деления a на b .
Возведение в степень **
Оператор возведения в степень a ** b возводит a в степень b .
В школьной математике мы записываем это как a b .
Математически, оператор работает и для нецелых чисел. Например, квадратный корень является возведением в степень 1/2 :
Сложение строк при помощи бинарного +
Давайте рассмотрим специальные возможности операторов JavaScript, которые выходят за рамки школьной арифметики.
Обычно при помощи плюса ‘+’ складывают числа.
Но если бинарный оператор ‘+’ применить к строкам, то он их объединяет в одну:
Обратите внимание, если хотя бы один операнд является строкой, то второй будет также преобразован в строку.
Как видите, не важно, первый или второй операнд является строкой.
Вот пример посложнее:
Здесь операторы работают один за другим. Первый + складывает два числа и возвращает 4 , затем следующий + объединяет результат со строкой, производя действие 4 + ‘1’ = ’41’ .
Сложение и преобразование строк — это особенность бинарного плюса + . Другие арифметические операторы работают только с числами и всегда преобразуют операнды в числа.
Например, вычитание и деление:
Приведение к числу, унарный +
Плюс + существует в двух формах: бинарной, которую мы использовали выше, и унарной.
Унарный, то есть применённый к одному значению, плюс + ничего не делает с числами. Но если операнд не число, унарный плюс преобразует его в число.
На самом деле это то же самое, что и Number(. ) , только короче.
Необходимость преобразовывать строки в числа возникает очень часто. Например, обычно значения полей HTML-формы — это строки. А что, если их нужно, к примеру, сложить?
Бинарный плюс сложит их как строки:
Поэтому используем унарный плюс, чтобы преобразовать к числу:
С точки зрения математика, такое изобилие плюсов выглядит странным. Но с точки зрения программиста тут нет ничего особенного: сначала выполнятся унарные плюсы, которые приведут строки к числам, а затем бинарный ‘+’ их сложит.
Почему унарные плюсы выполнились до бинарного сложения? Как мы сейчас увидим, дело в их приоритете.
Приоритет операторов
В том случае, если в выражении есть несколько операторов – порядок их выполнения определяется приоритетом, или, другими словами, существует определённый порядок выполнения операторов.
Из школы мы знаем, что умножение в выражении 1 + 2 * 2 выполнится раньше сложения. Это как раз и есть «приоритет». Говорят, что умножение имеет более высокий приоритет, чем сложение.
Скобки важнее, чем приоритет, так что, если мы не удовлетворены порядком по умолчанию, мы можем использовать их, чтобы изменить приоритет. Например, написать (1 + 2) * 2 .
В JavaScript много операторов. Каждый оператор имеет соответствующий номер приоритета. Тот, у кого это число больше, – выполнится раньше. Если приоритет одинаковый, то порядок выполнения – слева направо.
Отрывок из таблицы приоритетов (нет необходимости всё запоминать, обратите внимание, что приоритет унарных операторов выше, чем соответствующих бинарных):
| Приоритет | Название | Обозначение |
|---|---|---|
| … | … | … |
| 15 | унарный плюс | + |
| 15 | унарный минус | — |
| 14 | возведение в степень | ** |
| 13 | умножение | * |
| 13 | деление | / |
| 12 | сложение | + |
| 12 | вычитание | — |
| … | … | … |
| 2 | присваивание | = |
| … | … | … |
Так как «унарный плюс» имеет приоритет 15 , который выше, чем 12 у «сложения» (бинарный плюс), то в выражении "+apples + +oranges" сначала выполнятся унарные плюсы, а затем сложение.
Присваивание
Давайте отметим, что в таблице приоритетов также есть оператор присваивания = . У него один из самых низких приоритетов: 2 .
Именно поэтому, когда переменной что-либо присваивают, например, x = 2 * 2 + 1 , то сначала выполнится арифметика, а уже затем произойдёт присваивание = с сохранением результата в x .
Присваивание = возвращает значение
Тот факт, что = является оператором, а не «магической» конструкцией языка, имеет интересные последствия.
Большинство операторов в JavaScript возвращают значение. Для некоторых это очевидно, например сложение + или умножение * . Но и оператор присваивания не является исключением.
Вызов x = value записывает value в x и возвращает его.
Благодаря этому присваивание можно использовать как часть более сложного выражения:
В примере выше результатом (a = b + 1) будет значение, которое присваивается переменной a (то есть 3 ). Потом оно используется для дальнейших вычислений.
Забавное применение присваивания, не так ли? Нам нужно понимать, как это работает, потому что иногда это можно увидеть в JavaScript-библиотеках.
Однако писать самим в таком стиле не рекомендуется. Такие трюки не сделают ваш код более понятным или читабельным.
Присваивание по цепочке
Рассмотрим ещё одну интересную возможность: цепочку присваиваний.
Такое присваивание работает справа налево. Сначала вычисляется самое правое выражение 2 + 2 , и затем результат присваивается переменным слева: c , b и a . В конце у всех переменных будет одно значение.
Опять-таки, чтобы код читался легче, лучше разделять подобные конструкции на несколько строчек:
Польза от такого стиля особенно ощущается при быстром просмотре кода.
Сокращённая арифметика с присваиванием
Часто нужно применить оператор к переменной и сохранить результат в ней же.