An article to understand operators in ECMAScript

Unary Operators

Operators that can only operate on one value are called unary operators

Incremental and decremental. The increment and decrement operators are borrowed from C, and come in two versions: pre-increment and post-increment.

• Prefix type: The operator is placed before the variable to be operated on. When performing prefix increment and decrement operations, the value of the variable is changed before the statement is evaluated.
  

var age = 29;
var anotherAge = --age + 2
console.log(age) // 28
console.log(anotherAge) // 30

Postfix type: The operator is placed after the variable to be operated on. Post-increment and decrement operations are performed after the statement containing them is evaluated.

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

The above four operators are applicable to any value, that is, they can be used for strings, Boolean values, floating-point values ​​and objects. Follow these rules:

• When applied to a string containing valid numeric characters, it is first converted to a numeric value and then the addition or subtraction operation is performed. Convert string variables to numeric variables
• When applied to a string containing no numeric characters, sets the value of the variable to NaN. Convert string variables to numeric variables
• When applied to a Boolean value of false, it is first converted to 0 and then the addition or subtraction operation is performed. Boolean variables become numeric variables
• When applied to a Boolean value of true, it is first converted to 0 and then the addition or subtraction operation is performed. Boolean variables become numeric variables
• When applied to floating point values, performs addition or subtraction of 1.
• When applied to an object, first call the object's valueOf() method to obtain a value to operate on, and then apply the above rules to that value. If it is NaN, the toString() method is called and then the above rules are applied. Object variables become numeric variables

The above rules are verified:

var s1 = "2";
var s2 = "z";
var b = false;
var f = 1.1;
var o = {
    valueOf: function () {
        return -1
    }
}
console.log(s1++); // 2
console.log(s1); // 3
console.log(s2++); // NaN
console.log(s2); // NaN
console.log(b++); // 0
console.log(b); // 1
console.log(f--); // 1.1
console.log(f); // 0.1000000000000009
console.log(o--); // -1
console.log(o); // -2

Unary plus and minus operators

Unary addition and subtraction operators are mainly used for basic arithmetic operations, and can also be used to convert data types. That is, when a unary operator is applied to a non-numeric value, the operator performs a conversion on the value just like the Number() conversion function. Boolean values ​​false and true are converted to 0 and 1, and string values ​​are parsed according to a special set of rules. Objects are parsed by calling their valueOf() or toString() method first, and then the resulting value is converted. Take the unary plus operator as an example:

var s1 = "01";
var s2 = "1.1";
var s3 = "z";
var b = false;
var f = 1.1;
var o = {
    valueOf: function () {
        return -1
    }
}
s1 = +s1
s2 = +s2
s3 = +s3
b = +b
f = +f
o = +o
console.log(s1) // 1
console.log(s2) // 1.1
console.log(s3) // NaN
console.log(b) // 0
console.log(f) // 1.1
console.log(o) // -1

Boolean Operators

There are three Boolean operators: NOT, AND, and OR.

1. Logical NOT. Indicated by an exclamation mark (!), it can be used with any value in ECMAScript. This operator returns a Boolean value regardless of the data type of its operands. The logical NOT operator first converts its operand to a Boolean value and then negates it. Follow the rules

• If the operand is an object, returns false.
• Returns true if the operand is an empty string.
• If the operand is a non-empty string, returns false.
• Returns true if the operand is a value of 0.
• If the operand is any non-zero value (including Infinity), returns false.
• If the operand is null, returns true
• Return true if the operand is NaN.
• If the operand is undefined, returns true.

console.log(!false); // true
console.log(!"blue"); // false
console.log(!""); // true
console.log(!0); // true
console.log(!undefined); // true
console.log(!null); // true
console.log(!NaN); // true
console.log(!12345); false

2. Logical AND. The operator is represented by two ampersands (&&) and has two operands. The logical AND operator can be applied to operands of any type, not just Boolean values. The logical AND operation does not necessarily return a Boolean value if one of the operands is not a Boolean value; in this case, it follows these rules:

• If the first operand is an object, then the second operand is returned.
• If the second operand is an object, that object is returned only if the first operand evaluates to true.
• If both operands are objects, returns the second operand.
• If the first operand is null, it returns null.
• If the first operand is NaN, then NaN is returned.
• If the first operand is undefined, then it returns undefined.

The logical AND operation is a short-circuit operation, that is, if the first operand can determine the result, the second operand will not be evaluated.

3. Logical OR. An operator is represented by two vertical bar symbols (||) and has two operands. Similar to the logical AND operation, logical OR does not necessarily return a Boolean value if one of the operands is not a Boolean value; in this case, it follows the following rules:

• If the first operand is an object, then 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, returns null.
• If both operands are NaN, then NaN is returned.
• If both operands are undefined, then undefined is returned.

Like the logical AND operator, the logical OR operator is also a short-circuiting operation. That is, if the first operand evaluates to true, the second operand will not be evaluated.

Multiplication Operator

ECMAScript defines three multiplicative operators: multiplication, division, and modulo. If an operand in a multiplication calculation is not a numeric value, the backend will first use the Number() conversion function to convert it to a numeric value, such as an empty string will be treated as 0, and a Boolean value of true will be treated as 1.

1. Multiplication. The operator is represented by an asterisk (*) and is used to calculate the product of two numbers. The multiplication operator follows special rules when dealing with special values:

• If both operands are numbers, regular multiplication is performed, that is, the result of multiplying two positive numbers or two negative numbers is still positive, but if only one operand is signed then the result is negative. If the product exceeds the range of ECMAScript numbers, Infinity or -Infinity is returned.
• If either operand is NaN, the result is NaN
• If Infinity is multiplied by 0, the result is NaN
• If Infinity is multiplied by a non-zero value, the result is Infinity or -Infinity, depending on the sign of the signed operand.
• If Infinity is multiplied by Infinity, the result is Infinity
• If one of the operands is not a number, Number() is called behind the scenes to convert it to a number, and then the above rules are applied.

2. Division. The operator is represented by a slash symbol (/) and performs the calculation of dividing the second operand by the first operand. Follow these rules:

• If both operands are numbers, regular division is performed, that is, the result of dividing two positive numbers or two negative numbers is still positive; if only one operand is signed, the result is negative. If the value exceeds the range of ECMAScript numeric values, Infinity or -Infinity is returned.
• If either operand is NaN, the result is NaN
• If Infinity is divided by Infinity, the result is NaN
• If 0 is divided by 0, the result is NaN
• If a nonzero finite number is divided by zero, the result is Infinity or -Infinity, depending on the sign of the signed operand.
• If Infinity is divided by any nonzero value, the result is Infinity or -Infinity, depending on the sign of the signed operand.
• If one of the operands is not a number, Number() is called behind the scenes to convert it to a number, and then the above rules are applied.

3. Find the modulus (remainder). Operators are represented by a percent sign (%). Follow these rules:

• If the operands are both numbers, perform regular division and return the remainder.
• If the dividend is infinite and the divisor is finite, the result is NaN.
• If the dividend is a finite number and the divisor is zero, the result is NaN
• If Infinity is divided by Infinity, the result is NaN
• If the dividend is a finite number and the divisor is an infinite number, the result is the dividend.
• If the dividend is zero, the result is zero
• If one of the operands is not a number, Number() is called behind the scenes to convert it to a number, and then the above rules are applied.

Additive Operator

Similar to the multiplication operator, the addition operator also converts between different data types behind the scenes.

1. Addition. The addition operator is represented by the plus sign (+). If both operands are numbers, normal addition is performed and the result is returned according to the following rules:

• If either operand is NaN, the result is NaN
• If Infinity plus Infinity, the result is Infinity
• If it is -Infinity plus -Infinity, the result is -Infinity
• If Infinity plus -Infinity, the result is NaN
• If it is +0 plus +0, the result is +0
• If it is -0 plus -0, the result is -0
• If it is +0 plus -0, the result is 0

If either operand is a string, the following rules apply:

• If both operands are strings, the second operand is concatenated with the first.
• If only one operand is a string, the other operand is converted to a string and the two strings are concatenated.
• If one of the operands is an object, a number, or a Boolean value, its toString() method is called to get the corresponding string value, and then the previous rules for strings are applied.
• If it is undefined and null, the String() function is called and the strings "undefined" and "null" are obtained respectively.

2. Subtraction. The subtraction operator is represented by the minus sign (-) and follows the same rules as the addition operator:

• If both operands are numeric, normal arithmetic subtraction is performed and the result is returned.
• If either operand is NaN, the result is NaN
• If Infinity is subtracted from Infinity, the result is NaN
• If -Infinity minus -Infinity, the result is NaN
• If Infinity minus -Infinity, the result is Infinity
• If -Infinity is Infinity, then the result is -Infinity
• If it is +0 minus +0, the result is +0
• If it is -0 minus +0, the result is -0
• If -0 minus -0, the result is +0
• If one of the operands is a string, Boolean value, null, or undefined, the Number() function is now called in the background to convert it to a numeric value, and then the subtraction calculation is performed according to the previous rules. If the result of the conversion is NaN, the result of the subtraction is NaN
• If one of the operands is an object, the object's valueOf() method is called to get the value representing the object. If the resulting value is NaN, the result of the subtraction is NaN. If the object does not have a valueOf() method, its toString() method is called and the resulting string is converted to a numeric value.

var result1 = 5 - true
var result2 = NaN - 1
var result3 = 5 - 3
var result4 = 5 - ""
var result5 = 5 - "2"
var result6 = 5 - null
console.log(result1) // 4, true is converted to 1
console.log(result2) // NaN
console.log(result3) // 2
console.log(result4) // 5, empty string is converted to 0
console.log(result5) // 3, string 2 is converted to number 2
console.log(result6) // 5, because null is converted to 0

Relational Operators

There are four relational comparison operators: less than (<), greater than (>), less than or equal to (<=), and greater than or equal to (>=). When non-numeric values ​​are used as operands of relational operators, data conversion or some strange operations must also be performed. The corresponding rules are as follows:

• If both operands are numbers, a numeric comparison is performed.
• If both operands are strings, the character encoding values ​​of the two strings are compared.
• If one operand is a number, the other operand is converted to a number and then a numeric comparison is performed.
• If one operand is an object, the object's valueOf() method is called and the result is compared according to the previous rules. If the object does not have a valueOf() method, the toString() method is called and the result is used to perform a comparison according to the previous rules.
• If one operand is a Boolean value, it is converted to a numeric value before the comparison is performed.

When comparing strings, what is actually compared is the character code value of each character in the corresponding position in the two strings. After this comparison, a Boolean value is returned. The character code of uppercase letters is smaller than that of lowercase letters.

Equality Operator

Two sets of operators: equality and inequality - convert first and then compare; strict equality and inequality - compare only without conversion

1. Equality and inequality. The equality operator is represented by two equal signs (==), and returns true if the two operands are equal. The inequality operator is represented by an exclamation mark followed by an equal sign (!=), and returns true if the two operands are not equal. Both operators convert their operands (often called casting) before comparing them for equality. When converting between different data types, follow these basic rules:

• If one operand is a Boolean value, it is converted to a numeric value before being compared for equality—false is converted to 0 and true is converted to 1.
• If one operand is a string and the other is a number, the string is converted to a number before comparing for equality.
• If one operand is an object and the other is not, the valueOf() method of the object is called and the primitive type value is compared according to the previous rules.

These two operators follow the following rules when comparing

• null and undefined are equivalent
• Null and undefined cannot be converted to any other value before comparing for equality
• If either operand is NaN, the equality operator returns false, while the inequality operator returns true. The equality operator returns false even if both operands are NaNs; NaN is not equal to NaN by rule.
• If both operands are objects, they are compared to see if they are the same object. The equality operator returns true if both operands refer to the same object; otherwise, it returns false.

2. Congruent and incongruent. The strict equality operator is represented by three equal signs (===), and it returns true only if the two operands are equal without conversion. The strict inequality operator has an exclamation mark followed by two equal signs (!==), which returns true if the two operands are not equal without conversion.

var result1 = ("55" == 55)
var result2 = ("55" === 55)
var result3 = ("55" != 55)
var result4 = ("55" !== 55)
console.log(result1) // true
console.log(result2) // false
console.log(result3) // false
console.log(result4) // true

Conditional Operators

Syntax: var max = (num1 > num2) ? num1 : num2

In the above example, max will store the maximum value. The expression means: if num1 is greater than num2 (the relational expression returns true), the value of num1 is assigned to max; if num1 is less than or equal to num2 (the relational expression returns false), the value of num2 is assigned to max.

Assignment Operator

The assignment operator is represented by the equal sign (=), and its function is to assign the value on the right to the variable on the left. If you add a multiplication operator, an additive operator, or a bitwise operator before the equal sign, you can complete a compound assignment operation. Each of the main arithmetic operators (and a few other operators) has a corresponding compound assignment operator. These operators are as follows:

• Multiplication/Assignment——*=
• Division/Assignment——/=
• Modulo/Assignment——%=
• Addition/Assignment——+=
• Subtraction/Assignment——-=
• Left shift/assignment——<<=
• Signed right shift/assignment——>>=
• Unsigned right shift/assignment——>>>=

Comma Operator

The comma operator can perform multiple operations in one statement, such as: var num1=1, num2=2, num3=3;

The comma operator can also be used for assignment. When used for assignment, the comma operator always returns the last item in the expression. For example: var num= (5, 6, 1, 4, 7, 0); // num值為0

Summarize

This is the end of this article about operators in ECMAScript. For more relevant ECMAScript operators, please search for previous articles on 123WORDPRESS.COM or continue to browse the related articles below. I hope you will support 123WORDPRESS.COM in the future!