js中相等判断===、==、Object.is()的区别

前端  /  管理员 发布于 7年前   196

相信刚接触JS的人都会被他的相等性判断给整糊涂，看看下面代码，你能答对几个？

NaN === NaN // falseNaN == NaN // falseObject.is(NaN, NaN) // true0 == false  // true1 == true   // trueNumber(null) === 0  // truenull == 0   // false

Javascript提供了三种不同的值比较操作，分别是严格相等、宽松相等、以及Object.is，今天查完资料后做了一下总结，希望下面的内容能够对大家有所帮助，如果哪些地方有误的话，也欢迎大家指正。

【相关课程推荐：JavaScript视频教程】

1. 严格相等 x === y判断逻辑

1. 如果x的数据类型和y的数据类型不相同，返回false；

2. 如果x是Number类型

● x是NaN，返回false

● y是NaN，返回false

● x的值和y的值相等，返回true

● x是+0，y是-0，返回true

● x是-0，y是+0，返回true

● 否则返回false

3. 其他类型参照SameValueNonNumber(x, y)

● 断言：x,y不是Number类型;

● 断言: x,y的数据类型相同;

● x是undefined, y是undefined return true;

● x是null, y是null,return true;

● x是字符串类型,当且仅当x,y字符序列完全相同时（长度相同，每个位置上的字符也相同）返回true, 否则返回false；

● 如果x是布尔类型，当x,y都为true或者都为false时返回true，否则返回false；

● 如果x是symbol类型，当x,y是相同的symbol值，返回true，否则返回false;

● 如果x,y是同一个对象值，返回true，否则返回false;

NaN === NaN // falseundefined === undefined // truenull === null   // trueundefined === null  // false

2. 宽松相等 x == y

1. 如果x,y的类型相同，返回x===y的结果；

2. 如果x是null, y是undefined， 返回true;

3. 如果x是undefined, y是null, 返回true;

4. 如果x是数值，y是字符串, 返回x == ToNumber(y);

5. 如果x是字符串，y是数值, 返回ToNumber(x) == y;

6. 如果x是布尔类型， 返回ToNumber(x)==y 的结果;

7. 如果y是布尔类型，返回 x==ToNumber(y) 的结果；

8. 如果x是String或Number或Symbol中的一种并且Type(y)是Object，返回 x==ToPrimitive(y) 的结果

9. 如果Type(x)是Object并且Type(y)是String或Number或Symbol中的一种，返回 ToPrimitive(x)==y 的结果

10. 其他返回false

12 == '0xc' // true, 0xc是16进制12 == '12'  // true12 == '12c' // false, 说明ToNumber转换是用的Number()方法

注意：

Number(null) === 0

但是

null == 0 // false,

2.1 ToNumber将一个值转换为数值类型

1. 如果是boolean类型， true返回1，false返回0；

2. 如果是数值，只是简单的传入返回；

3. 如果是null，返回0

4. 如果是undefined, 返回NaN;

5. 如果是字符串，字符串如果只包含数字，则将其转换成十进制数；如果是有效的浮点格式，将其转换成对应的浮点数值；如果是二进制或十六进制将其转换成对应的十进制数值；

6. 如果是对象，调用对象的valueOf()方法，然后依照前面规则转换，如果valueOf返回值是NaN，则调用toString()方法，再依照前面的规则转换返回的字符串

2.2 ToPrimitive

toPrimitive(A)通过尝试调用 A 的A.toString() 和 A.valueOf() 方法，将参数 A 转换为原始值（Primitive）；

JS中原始类型有：Number、String、Boolean、Null、Undefined;

不同类型对象的valueOf()方法的返回值:

对象	返回值
Array	返回数组对象本身。
Boolean	布尔值
Date	存储的时间是从 1970 年 1 月 1 日午夜开始计的毫秒数 UTC
Function	函数本身
Number	数字值
Object	对象本身。这是默认情况, 可以覆盖自定义对象的valueOf方法
String	字符串值

// Array：返回数组对象本身var array = ["ABC", true, 12, -5];console.log(array.valueOf() === array);   // true// Date：当前时间距1970年1月1日午夜的毫秒数var date = new Date(2013, 7, 18, 23, 11, 59, 230);console.log(date.valueOf());   // 1376838719230// Number：返回数字值var num =  15.26540;console.log(num.valueOf());   // 15.2654// 布尔：返回布尔值true或falsevar bool = true;console.log(bool.valueOf() === bool);   // true// new一个Boolean对象var newBool = new Boolean(true);// valueOf()返回的是true，两者的值相等console.log(newBool.valueOf() == newBool);   // true// 但是不全等，两者类型不相等，前者是boolean类型，后者是object类型console.log(newBool.valueOf() === newBool);   // false// Function：返回函数本身function foo(){}console.log( foo.valueOf() === foo );   // truevar foo2 =  new Function("x", "y", "return x + y;");console.log( foo2.valueOf() );/*ƒ anonymous(x,y) {return x + y;}*/// Object：返回对象本身var obj = {name: "张三", age: 18};console.log( obj.valueOf() === obj );   // true// String：返回字符串值var str = "http://www.xyz.com";console.log( str.valueOf() === str );   // true// new一个字符串对象var str2 = new String("http://www.xyz.com");// 两者的值相等，但不全等，因为类型不同，前者为string类型，后者为object类型console.log( str2.valueOf() === str2 );   // false

3.同值相等

同值相等由 Object.is 方法判断：

● 两个值都是 undefined

● 两个值都是 null

● 两个值都是 true 或者都是 false

● 两个值是由相同个数的字符按照相同的顺序组成的字符串

● 两个值指向同一个对象

● 两个值都是数字并且

○ 都是正零 +0，

○ 或者都是负零 -0，

○ 或者都是 NaN

○ 都是除零和 NaN 外的其它同一个数字

Object.is('foo', 'foo');     // trueObject.is(window, window);   // trueObject.is('foo', 'bar');     // falseObject.is([], []);           // falsevar foo = { a: 1 };var bar = { a: 1 };Object.is(foo, foo);         // trueObject.is(foo, bar);         // falseObject.is(null, null);       // trueObject.is(true, 'true')     // false// 特例Object.is(0, -0);// falseObject.is(0, +0);// trueObject.is(-0, -0);           // trueObject.is(NaN, 0/0);         // true

4.零值相等

与同值相等类似，不过会认为 +0 与 -0 相等。

小结

=== 不做类型转换，当两边的数类型不相同时，直接返回false；当前类型相同且都是数值类型的时候，有一个是NaN，那么结果就是false, 另外 +0 === -0

==运算符，当两边操作数类不相同时会做隐式转换，然后才进行比较，这样的话就会出现 false == 0, '' == false 等现象， 但是Object.is不会做这种转换

本文来自 js教程 栏目，欢迎学习！

以上就是js中相等判断===、==、Object.is()的区别的详细内容，更多请关注其它相关文章！