JavaScript operators

What are operators

javascript

The operator is usually a symbol that is used when we want to perform some standard, frequently used operation, such as assignment of values, comparison of values, arithmetic operations…
Operators can be understood as special functions which, unlike “ordinary functions”, are written in a “non-standard way”. Operators use the so-called “infix” notation (the function name is placed between two parameters). The standard operator shown with “infix” notation looks like this:
... operator...
The following example shows that there is an essential similarity between the operator and the function:

The most common are binary operators (operators that take two values as input), although there are also unary operators that perform certain operations on only one value:

Priority and associativity of operators

The associativity of the operator is a property that tells from which end the grouping takes place (starting from the left end or from the right end). Each operator has its own associativity rule. In the followingtable of associativity and importance of operators operators and their associativity are shown, and they are ranked according to “importance” from “most important” to the weakest.

Importance Operator Operator Name Associativeness 20 ( … ) Grouping bracket n/a 19 . Access to an object’s property “dot natation” from left to right … [ … ] Access to an object’s property “bracket notation” from left to right new … ( … ) new (with arguments) n/a 18 … ( … ) Calling Functions from left to right new … new (no argument) from right to left 17 … ++ Postfix Increment n/a … — Postfix Decrement n/a 16 ! … Logical NOT from right to left ~ … Bitwise NOT from right to left + … Unary Plus from right to left – … Unary Negation from right to left ++ … Prefix Increment from right to left — … Prefix Decrement from right to left typeof … typeof from right to left void … void from right to left delete … delete from right to left 15 … ** … Exponentiation from right to left 14 … * … Multiplication from left to right … / … Division from left to right … % … Remainder from left to right 13 … + … Addition from left to right … – … Subtraction from left to right 12 … << … Bitwise Left Shift from left to right … >> … Bitwise Right Shift from left to right … >>> … Bitwise Unsigned Right Shift from left to right 11 … < … Less Than from left to right … <= … Less Than Or Equal from left to right … > … Greater Than from left to right … >= … Greater Than Or Equal from left to right … in … in from left to right … instanceof … instanceof from left to right 10 … == … Equality from left to right … != … Inequality from left to right … === … Strict Equality from left to right … !== … Strict Inequality from left to right 9 … & … Bitwise AND from left to right 8 … ^ … Bitwise XOR from left to right 7 … | … Bitwise OR from left to right 6 … && … Logical AND from left to right 5 … || … Logical OR from left to right 4 … ? … : … Conditional from right to left 3 … = … Assignment from right to left … += … … -= … … **= … … *= … … /= … … %= … … <<= … … >>= … … >>>= … … &= … … ^= … … |= … 2 yield … yield from right to left yield* … yield* from right to left 1  … Spread n/a 0 … , … Comma / Sequence from left to right
“undefined” & “null” as comparators!?

Comparing undefined to numbers or strings ALWAYS returns FALSE:

Comparison with “null” is extremely illogical, at the very least strange and without any rules, and such comparisons should be avoided at all, i.e. prevent null from appearing in the comparison!

And if they are compared to each other

Specificity of “==” operator

Operator “==” so called “weak equality” compares two operands according to their value and returns a logical value of TRUE or FALSE.
Doimplicit type conversion will be performed, it depends on which types are being compared. If the comparison of two values ​​of different types leads to an implicit conversion of one of them, this procedure is performed according to the conversion rules, followed by a comparison. The following table lists all cases between all possible types for comparison with the operator “==”

  Operand B
    Undefined Null Number String Boolean Object
Operand A Undefined true true false false false false
Null true true false false false false
Number false false A === B A === ToNumber(B) A === ToNumber(B) A == ToPrimitive(B)
String false false ToNumber(A) === B A === B ToNumber(A) === ToNumber(B) A == ToPrimitive(B)
Boolean false false ToNumber(A) === B ToNumber(A) === ToNumber(B) A === B ToNumber(A) == ToPrimitive(B)
Object false false ToPrimitive(A) == B ToPrimitive(A) == B ToPrimitive(A) == ToNumber(B) A === B
Example

When comparing these two types, the rule is to convert string to number

Example

This case often causes problems because some rules in JS can lead to the wrong conclusion. The rule to follow is that when comparing logical value is converted to number, see more here.

Example

According to ES5 comparing undefined == null with the “loose equality” operator ALWAYS returns TRUE.

Example

When comparing undefined/null to some primitive data type it ALWAYS returns FALSE.

A common misconception is that when comparing undefined/null and some other primitive data type a conversion to FALSE and then to zero is expected, and that after that a comparison is possible.

Specificity of operators && and ||

When one or even both operands are not of logical type when using operators && and ||, conversion to logical type occurs according to conversion rules, but after solving the condition they do not return a logical value, but return the value of one of the two operands. What will be the result of the conditions is determined according to the following rules:

  • For the operator || after the conversion of “not logical” type to logical when solving the condition, the following applies:
    if the final solution of the operator condition is TRUE, it returns the value of the first operand, and in the case of FALSE, it returns the value of the second operand.
  • For the operator && after the conversion of “not logical” type to logical when solving the condition, the following applies:
    if the final solution of the operator condition is TRUE, it returns the value of the second operand and vice versa.

Examples

Additional conditions

Explanation:

Respecting the precedence of the operators used, the logical “and” takes precedence over the logical “or”, so the previous expression can be converted to:

In order to determine the conditions in the parentheses, an implicit type conversion is performed to a logical type:

The solution of the condition is TRUE, and therefore according to the mentioned rule for TRUE, the operator “&&” returns the value of the second operand, so the sorted expression looks like this:

Implicit conversion to boolean type is done again:

The solution to this condition is TRUE, so according to the rule, the operator || returns the value of the first operand.

Continued assignment

Explanation:

The associativity property of the assignment operator “=” is right-to-left so the previous expression could be displayed grouped like this:

Therefore, the value 4 will first be assigned to the variable b, after which the expression becomes:

3.) Linked comparison

Explanation:

The associativity of the operator “<" is from left to right so the expression after grouping looks like this:

Solving the first operation giveslogical value FALSE, so the lookalike expression

When comparing two elements of different types, there is an implicit conversion of FALSE to the number “0”, after which the expression looks like:

Which returns the result TRUE