Detailed explanation of the contents of ==, === and Object.js() in js (comprehensive)

This article brings you a detailed explanation of ==, === and Object.js() in js (comprehensive). It has certain reference value. Friends in need can refer to it. I hope It will help you.

This article mainly explains the three equality operations in JavaScript: ==, === and Object.js(). Deepen everyone's impression through comparison and examples, and provide detailed explanations of individual examples.

Preparatory knowledge

Detailed explanation of the knowledge of ToPrimitive abstract operation in ECMAScript7 specification (example)

=== operator

For x === y, the comparison steps of this operator are as follows:

1. If the type of x is different from the type of y, return false;

2. If the type of x is a number , then:

a. If x is NaN, return false;

b. If y is NaN, return false;

c. If x and y are the same Numeric value, returns true;

d. If x is 0 and y is -0, returns true;

e. If x is -0 and y is 0, returns true;

f. Return false;

3. Return the result of SameValueNonNumber(x, y).

SameValueNonNumber(x, y) abstract operation compares two non-numbers and whether x and y of the same type are equal. The comparison steps are as follows:

1. If the type of x is null or undefined, Return true;

2. If x is a string type,

If x and y are exactly the same character encoding sequence, return true, otherwise return false;

3 , If x is a Boolean type,

4. If x and y are both true or false, return true, otherwise return false;

5. If x is a symbol type,

If x and y are the same symbol value, return true, otherwise return false;

6. If x and y are the same object value, return true, otherwise return false.

The points to note are NaN, 0, -0:

NaN === NaN // false
+0 === -0 // true
-0 === +0 // true

These three examples correspond to 2.1, 2.4 and 2.5 in the x === y comparison step respectively. The output results of these three examples are completely in accordance with the definitions of the specifications. There is no reason, this is how the specifications are defined. As for why the specification is defined in this way, you may need to ask the makers of the specification. This is beyond the scope of this article.

Object.is()

For Object.is(x, y), the abstract operation SameValue(x, y) will be used for comparison. The steps of this abstract operation are as follows:

1. If the type of x is different from the type of y, return false;

2. If the type of x is a number, then:

a. If both x and y are NaN, returns true;

b. If x is 0 and y is -0, returns false;

c. If x is -0 and y is 0, returns false;

d. If x and y are the same numeric value, return true;

e, return false;

3. Return the result of SameValueNonNumber(x, y).

It can be seen that the difference between === and Object.is() lies in the processing of NaN and signed 0:

NaN === NaN // false
+0 === -0 // true
-0 === +0 // true
Object.is(NaN, NaN) // true
Object.is(+0, -0) // false
Object.is(-0, +0) // false

==Operator

For x == y, the comparison steps of this operator are as follows:

1. If x and y are of the same type, return the result of x === y;

2. If x is null , y is undefined, return true;

3. If x is undefined and y is null, return true;

4. If the type of x is a number and the type of y is a string, Return the result of x == ToNumber(y);

5. If the type of x is a string and the type of y is a number, return the result of ToNumber(x) == y;

6. If the type of x is a Boolean type, return the result of ToNumber(x) == y;

7. If the type of y is a Boolean type, return the result of x == ToNumber(y);

8. If the type of x is one of string, number or Symbol, and the type of y is an object, return the result of x == ToPrimitive(y);

9. If x The type is an object, and the type of y is one of string, number, or Symbol. The result of ToPrimitive(x) == y is returned;

10. Return false.

The method ToNumber was used above, and the steps for ToNumber(x) are as follows:

1. If the type of x is Undefined, return NaN;

2. If the type of x If it is Null, return 0;

3. If the type of x is a Boolean type, return 1 if x is true, and return 0 if false;

4. If the type of x is a number, return x;

5. If the type of x is a string, the reference string is converted into a number. This article will not introduce this content in detail;

6. If the type of x is a Symbol, NaN is returned;

7. If the type of x is an object,

a. Let the value of primValue be ToPrimitive(x, hint Number);

b. Return the result of ToNumber(primValue) ;

[] == ![]

The comparison steps of the == operator are discussed above. Let’s talk about an example to deepen our impression:

[] == ![]

First, the left [] is an empty array, the type is object, the right side is ![], [] is a true value, so the result of ![] is false:

[] == ![] // => [] == false

Then it will go to the x == y comparison step In step 7, return the result of x == ToNumber(y), that is:

[] == false // => [] == ToNumber(false)

From step 3 of ToNumber(x), we know that ToNumber(false) returns 0:

[] == ToNumber(false) // => [] == +0

Then go to step 9 of the x == y comparison step and return the comparison result of ToPrimitive(x) == y:

[] == +0 // => ToPrimitive([]) == +0

The result of ToPrimitive([]) is the empty string "", please give the reason Check out the article ToPrimitive abstract operation in the ECMAScript7 specification. Therefore, the above is equivalent to:

"" == +0

Then go to step 5 of the x == y comparison step and return the result of ToNumber(x) == y:

"" == +0 // => ToNumber("") == +0

由ToNumber操作的第5步可知，ToNumber("")的结果是+0，所以也就是：

+0 == +0 // true

{} == !{}

首先，左边是{}，类型是对象，右边是!{}，{}是真值，所以!{}是false：

{} == !{} // => {} == false

然后同样会走到x == y比较步骤的第7步，返回x == ToNumber(y)的结果，也就是：

{} == false // => {} == ToNumber(false)

由ToNumber(x)的第3步可知，ToNumber(false)返回+0：

{} == ToNumber(false) // => {} == +0

然后走到x == y比较步骤的第9步，返回ToPrimitive(x) == y的比较结果：

{} == +0 // => ToPrimitive({}) == +0

ToPrimitive({})的结果是字符串"[object Object]"，原因请查看文章ECMAScript7规范中的ToPrimitive抽象操作。所以，上面等价于：

"[object Object]" == +0

然后走到x == y比较步骤的第5步，返回ToNumber(x) == y的结果：

"[object Object]" == +0 // => ToNumber("[object Object]") == +0

由ToNumber操作的第5步可知，ToNumber("[object Object]")的结果是NaN，所以也就是：

NaN == +0 // false

所以，[] == ![]的结果是true，{} == !{}的结果是false。可能有人第一次看到[] == ![]的时候，觉得这个的比较结果怎么可能是true。我觉得有时候不要感性的去认识问题，按照规定的运算步骤走一遍，结果是什么就是什么。

总结

本文讲解了JavaScript中的三种相等运算：==，===和Object.js()，希望对大家有所帮助。

The above is the detailed content of Detailed explanation of the contents of ==, === and Object.js() in js (comprehensive). For more information, please follow other related articles on the PHP Chinese website!