1 Unary operator
2 Boolean operators
3 Multiplicative operator
4 Exponential operator
5 Additive operator
6 relational operators
7 Equality operator
8 Conditional operation mark
9 Assignment operator
10 comma operator

1 Unary operator

Operators that only operate on one value are called unary operators.
(1) Increment and decrement operators
Whether using prefix increment or prefix decrement operators, the value of the variable will change before the statement is evaluated.

let age = 29;
let another = --age+2;

console.log(age); //28
console.log(another); //30

The main difference between the suffix version and the prefix version is that the increment and decrement of the suffix version only occurs after the statement is evaluated.

        let num1 = 2;
        let num2 = 20;
        let num3 = num1-- + num2; //22
        let num4 = num1 + num2; //21

The increment and decrement operators can be used for any value, meaning that they are not limited to integers, strings, Boolean values, floating-point values, and even objects. The increment and decrement operators follow the following rules:

For a string, if it is a valid numeric form, convert it to a numeric value and apply the change. The variable type changes from string to numeric value.
For a string, if it is not a valid numeric form, the value of the variable is set to NaN. The variable type changes from string to numeric value.
For a Boolean value, if it is false, it is converted to 0 before applying the change. The variable type changes from Boolean to numeric.
For boolean values, if it is true, convert to 1 and apply the change. The variable type changes from Boolean to numeric.
For floating point values, add 1 and subtract 1.
If it is an object, call its valueOf() method to obtain an operable value. Apply the above rules to the obtained value. If it is NaN, call toString() and apply other rules again, the variable type changes from object to value.

(2) Unary plus and unary minus
If unary plus is applied to non-numeric values, the same type conversion as using the Number() conversion function will be performed: Boolean values false and true are converted to 0 and 1, and strings are parsed according to special rules , The object will call their valueOf() and/or toString() methods to get convertible values.

        let s1 = "01";
        let s2 = "1.1";
        let s3 = "z";
        let b = false;
        let o = {
    
    
            valueOf() {
    
    
                return -1;
            }
        };

        s1 = +s1; //值变成数值1
        s2 = +s2; //值变成数值1.1
        s3 = +s3; //值变成NaN
        b = +b; //值变成数值0
        f = +f; //不变
        o = +o; //值变成-1

2 Boolean operators

There are 3 Boolean operators: logical negation, logical AND and logical OR.
(1) Logical negation The logical
negation operator is represented by an exclamation mark (!) and can be applied to any value in ECMAScript. This operator always returns a Boolean value, no matter what data type is applied. The logical negation operator first converts the operand to a Boolean value and then negates it. The logical negation operator will follow the following rules:

If the operand is an object, it returns false
If the operand is an empty string, return true
If the operand is a non-empty string, return false
If the operand is the value 0, return true
If the operand is a non-zero value, return false
If the operand is null, return true
If the operand is NaN, return true
If the operand is undefined, return true

The logical negation operator can also be used to convert any value to a Boolean value. Using two exclamation marks (!!) at the same time is equivalent to calling the transformation function Boolean().
(2) Logical AND The
logical AND operator is represented by two ampersands (&&) and is applied to two values.

First operand	Second operand	result
true	true	true
true	false	false
false	true	false
false	false	false

The logical AND operator can be used for any type of operand, not limited to Boolean values. If the operand is not a Boolean value, the logical AND does not necessarily return a Boolean value, but follows the following rules:

If the first operand is an object, return the second operand
If the second operand is an object, the object will only be returned if the first operand evaluates to true
If both operands are objects, the second operand is returned.
If one of the operands is null, return null
If one of the operands is NaN, NaN is returned
If one of the operands is undefined, return undefined

The logical AND operator is a short-circuit operator, meaning that if the first operand determines the result, then the second operand will never be evaluated. For the logical AND operator, if the first operand is false, then no matter what value the second operand is, the result cannot be equal to true.
(3) Logical OR The
logical OR operator is represented by two pipe characters (||) and follows the following rules

First operand	Second operand	result
true	true	true
true	false	true
false	true	true
false	false	false

Similar to logical and, if one of the operands is not a Boolean value, then the logical OR operator does not necessarily return a Boolean value. Follow the following principles:

If the first operand is an object, the first operand is returned.
If the first operand evaluates to false, the second operand is returned.
If both operands are objects, the first operand is returned.
If both operands are null, return null.
If both operands are NaN, NaN is returned.
If both operands are undefined, return undefined.

Similarly to logical AND, the logical OR operator also has the characteristic of short-circuiting. It's just that for logical OR, the first operand evaluates to true, and the second operand will not be evaluated again.
Using this behavior, you can avoid assigning null or undefined to variables:

let myObject = preferredObject || backupObject;

In this example, the variable myObject will be assigned one of two values. Among them, the preferredObject variable contains the preferred value, and the backupObject variable contains the backup value.

3 Multiplicative operator

ECMAScript defines three multiplicative operators: multiplication, division, and modulo. If the multiplicative operator has an operand that is not a numeric value, the operand will be converted to a numeric value by the Number() transformation function in the background.
Multiplication operator The
multiplication operator is represented by an asterisk (*) and can be used to calculate the product of two values. However, the multiplication operator also has some special behaviors when dealing with special values:

If any operand is NaN, NaN is returned
If Infinity is multiplied by 0, NaN is returned
If it is Infinity multiplied by a non-zero finite value, return Infinity or -Infinity according to the sign of the second operand
If it is Infinity multiplied by Infinity, return Infinity
If there is an operand that is not a numeric value, first use Number() to convert it to a numeric value in the background, and then apply the above rules.

Division Operator The
division operator is represented by a slash (/) and is used to calculate the quotient of the first operand divided by the second operand. Like the multiplication operator, the division operator has some special behaviors for special values:

If any operand is NaN, NaN is returned
If it is 0 divided by 0, NaN is returned
If it is a non-zero finite value divided by 0, return Infinity or -Infinity according to the sign of the first operand
If it is Infinity divided by Infinity, NaN is returned
If it is Infinity divided by any value, return Infinity or -Infinity according to the sign of the second operand
If there is an operand that is not a numeric value, first use the Number() function in the background to convert it to a numeric value, and then apply the above rules.

Modulus Operator The
modulus (remainder) operator is represented by a percentage sign (%). Like other multiplicative operators, the modulus operator has some special behaviors for special values:

If the dividend is unlimited and the divisor is a finite value, NaN is returned
If the dividend is a finite value and the divisor is 0, NaN is returned
If it is Infinity divided by Infinity, NaN is returned
If the dividend is a finite value and the divisor is an infinite value, the dividend is returned.
If the dividend is 0 and the divisor is not 0, return 0
If there is an operand that is not a numeric value, first use the Number() function in the background to convert it to a numeric value, and then apply the above rules.

4 Exponential operator

ECMAScript7 added the exponent operator, Math.pow() now has its own operator **, and the result is the same.

        console.log(Math.pow(3, 2)); //9
        console.log(3 ** 2); //9

5 Additive operator

(1) The additive operator (+) is used to sum two numbers. If both operands are numeric values, the addition operator performs the addition operation and returns the result according to the following rules:

If any operand is NaN, NaN is returned
If it is Infinity plus Infinity, return Infinity
If it is -Infinity plus -Infinity, then return -Infinity
If it is Infinity plus -Infinity, NaN is returned
If it is +0 plus +0, return +0
If it is -0 plus +0, return +0
If it is -0 plus -0, return -0

If one of the operands is a string, the following rules apply:

If both operands are strings, the second string is spliced after the first string
If only one operand is a string, convert the other operand to a string, and then concatenate the two strings together.

If any operand is an object, numeric value, or boolean, call their toString() method to obtain a string, and then apply the previous string rules. For undefined and null, call the String() function to obtain "undefined" and "null" respectively.

        let result1 = 5+5;
        console.log(result1); //10

        let result2 = 5+"5";
        console.log(result2);//"55"

(2) Subtraction operator The
subtraction operator (-) is also a frequently used operator. Like the addition operator, the subtraction operator also has a set of rules for handling conversions between different types in ECMAScript:

If any operand is NaN, NaN is returned
If it is Infinity minus Infinity, NaN is returned
If -Infinity minus -Infinity, NaN is returned
If it is Infinity minus -Infinity, return Infinity
If it is -Infinity minus Infinity, then return -Infinity
If it is +0 minus +0, return +0
If it is +0 minus -0, return -0
If it is -0 minus -0, it returns +0
If any operand is a string, boolean, null or undefined, first use Number() in the background to convert it to a numeric value, and then perform mathematical operations according to the previous rules.
If any operand is an object, call its valueOf() method to obtain the value representing it. If the value is NaN, the calculated result NaN is subtracted. If the object does not have a valueOf() method, its toString() method is called, and then the resulting string is converted to a value.

6 relational operators

Relational operators perform operations that compare two values, including less than (<), greater than (>), less than or equal to (<=), and greater than or equal to (>=). These operators all return Boolean values.
Like other operators in ECMAScript, type conversion and other behaviors occur when they are applied to different data types.

If the operands are all numeric values, perform numeric comparison
If the operands are all strings, compare the codes of the corresponding characters in the string one by one
If any operand is a numeric value, convert another operand into a numeric value and perform a numeric comparison
If any operand is an object, call the valueOf() method, and then perform the comparison according to the previous rules after obtaining the result. If there is no valueOf(), call the toString() method, and then perform the comparison according to the previous rules after obtaining the result.
If any operator is a Boolean value, it is converted to a numeric value and then the comparison is performed.

For strings, relational operators compare the codes of corresponding characters in the string, and these codes are numeric values. After the comparison is complete, a boolean value is returned. The encoding of uppercase letters is less than the encoding of lowercase letters, so the following situation will happen:

let result = "Brick"<"alphabet"; //true

Here the string "Brick" is considered smaller than the string "alphabet", because the code of the letter B is 66 and the code of the letter a is 97. To get the results of the comparison in alphabetical order, you must convert both to the same case (all uppercase or all lowercase) and then compare:

let result = "Brick".toLowerCase<"alphabet".toLowerCase; //false

Another strange phenomenon is when comparing two numeric strings, such as:

let result = "23"<"3"; //true

This returns true when comparing the strings "23" and "3". Because both operands are strings, their character codes are compared one by one (the code of the character "2" is 50, and the code of the character "3" is 51). However, if one of the operands is numeric, then the comparison result is correct:

let result = "23"<3; //false

As long as the numeric value is compared with the string, the string will be converted into a numeric value first, and then the numeric value will be compared. For numeric strings, this can ensure the correct result, but what if the string cannot be converted into a numeric value?

let result = "a"<3;

Because "a" cannot be converted to any meaningful value, it can only be converted to NaN. There is a rule that any relational operator returns false when it involves comparing NaN:

        let result1 = NaN<3; //false
        let result2 = NaN>=3; //false

7 Equality operator

(1) Equal to and unequal to
ECMAScript. The equal operator in ECMAScript is represented by two equal signs (==). If the operands are equal, it will return true. The inequality operator is represented by an exclamation mark equal to (!=). If the operands are not equal, it will return true. Both operators will perform type conversion first, and then determine whether the operands are equal:

If any operand is a Boolean value, convert it to a numeric value and compare for equality. False is converted to 0, and true is converted to 1.
If one operand is a string and the other operand is a numeric value, try to convert the string to a numeric value and compare whether it is equal.
If one operand is an object and the other operand is not, call the object valueOf() method to get its original value, and then compare according to the previous rules.

When comparing, these two operators will follow the following rules:

null and undefined are equal
Null and undefined cannot be converted to other types of values and then compared.
If any operand is NaN, the equality operator returns false, and the inequality operator returns true.
If both operands are objects, compare whether they are the same object. If both operands point to the same object, the equality operator returns true. Otherwise, the two are not equal.

(2) Congruence and inequality The
congruent and inequality operators are similar to the equality and inequality operators, except that they do not convert the operands when comparing equality. The congruent operator is represented by 3 equal signs (===), and only if the two operands are equal without conversion will it return true:

let result1 = ("55"==55); //true
let result2 = ("55"===55); //false

The inequality operator is represented by an exclamation mark and two equal signs (!==), and only if the two operands are not equal without conversion, will it return true.

8 Conditional operation mark

variable = boolean_expression?true_value:false_value;

The above code performs a conditional assignment operation, that is, according to the value of the conditional expression boolean_expression to determine which value is assigned to the variable variable. If boolean_expression is true, true_value is assigned; if boolean_expression is false, false_value is assigned.

9 Assignment operator

10 comma operator

The comma operator can be used to perform multiple operations in one statement:

let num1 = 1,num2 = 2,num3 = 3;

Study notes 4—JavaScript operators

table of Contents