前置知识:
判断两个变量的值是否相等,是编程中非常重要的一个操作。这里我们心里面先有两组对照,思考下:
- 相等 和 不相等
- 全等 和 不全等
1.介绍
在我们比较字符串、数值和布尔值的相等性,是比较简单的,但是到了比较对象的时候,问题就比较复杂。
早期的时候ECMAScript规范中,在判断相等和不相等时,会先将对象转换成相似的类型,再执行比较。后面有人质疑其合理性,最后ECMAScript提出解决方法:提供两组操作符:
- 相等和不相等(宽松相等):先转换再比较,使用==
- 全等和不全等(严格相等):仅比较不转换,使用===
另外还有一类ES6新增的方法:
- Object.is (ES6新增)
2.相等和不相等
JavaScript中用相等操作符使用==进行比较,若两个操作数相等,则返回true,否则返回false。反之,不相等操作符使用!=。
这两个操作符都会先转换操作数类型,再进行比较。
通常在转换不同数据类型时,相等和不相等会遵循以下规则:
- 若有一个操作数是布尔值,则比较前会将布尔值转换为数值:false转为0,true转为1。
- 若一个操作数是字符串,另一个是数值,则比较前会将字符串转换为数值。
- 若一个操作数是对象,另一个不是,则比较前会调用valueOf()方法,用返回的基本类型值来判断。
两个操作符进行比较时会遵循下面规则:
- null和undefined相等。
- 比较前不能讲null和undefined转换成其他值。
- 若一个操作数是NaN,则不相同(==时返回false,!=时返回true)。
- 若两个操作数是NaN,则不相同(==时返回false,!=时返回true)。
- 若两个操作数都是对象,则比较它们是不是同一个对象。
- 若两个操作数都指向同一个对象,则相等操作符返回true,否则返回false。
下面列出一些特殊情况的比较 :
![540f192f9e8fe790232728c42b6bf515.png](https://i-blog.csdnimg.cn/blog_migrate/104691eadd599abac45956fdbe5a9b82.jpeg)
3.全等和不全等
除了比较前不转换操作数歪,全等和不全等与相等和不相等并无区别,但使用的是===,只有当不转换的情况下两个操作数相同,才会返回true。
![def18d28cab145853fceab316eec5ab9.png](https://i-blog.csdnimg.cn/blog_migrate/b9686980d736a79a46163999ffe84cca.jpeg)
不全等操作符就相对应的使用!==:
![0119fb37a40d7e1ab3713bf3f7f99a3f.png](https://i-blog.csdnimg.cn/blog_migrate/0321d597176d7324bda195249094337d.jpeg)
特殊的:
![96c7366126078cb0985421f2c17f7417.png](https://i-blog.csdnimg.cn/blog_migrate/8378231d8e55ad380e6a671d31c65a7d.jpeg)
由于相等和不相等操作符存在类型转换问题,因此为了保持代码中数据类型的完整性,我们推荐使用去哪等和不全等操作符。
4.同值相等(Object.is)
Object.is(value1, value2);,传入两个需要对比的值。
Object.is() 判断两个值是否相同,并且不会对参数进行类型转换。如果下列任何一项成立,则两个值相同:
- 两个值都是 undefined
- 两个值都是 null
- 两个值都是 true 或者都是 false
- 两个值是由相同个数的字符按照相同的顺序组成的字符串
- 两个值指向同一个对象
- 两个值都是数字并且
- 都是正零+0
- 都是负零 -0
- 都是 NaN
- 都是除零和 NaN 外的其它同一个数字
![7a2dc97deae2e82be22672b37db013ce.png](https://i-blog.csdnimg.cn/blog_migrate/97e3aad6c524b453a0658a6d521ee3b6.jpeg)
另外还有特殊的:
- 零值相等:
- 与同值相等类似,不过会认为 +0 与 -0 相等。
5.对比图
相等操作符对于不同类型的值,进行的比较如下图所示(来源 MDN):
![1044a0df1709365cb4f6c932fb472039.png](https://i-blog.csdnimg.cn/blog_migrate/51f67b017d07a575b664346598b43777.jpeg)
注意:
- ToNumber(A) 表示比较前将参数 A 转换为数字
- ToPrimitive(A)通过尝试调用 A 的A.toString() 和 A.valueOf() 方法,将参数 A 转换为原始值(Primitive)。
![eb8225ed70676ec732c52116796167b0.png](https://i-blog.csdnimg.cn/blog_migrate/399cc35e815eb644fa8a8905b3ffdeac.jpeg)
![307270433efff384595b303183072ef8.png](https://i-blog.csdnimg.cn/blog_migrate/ad84c724b8eb3028597d6b0093cbc5cf.jpeg)
![64ea153947f5fab3a8b8780bc1356d18.png](https://i-blog.csdnimg.cn/blog_migrate/f567aea6d8c7a5814ca014449278da08.jpeg)
公众号:前端自习课
往期回顾
「JavaScript 从入门到精通」1.语法和数据类型
「JavaScript 从入门到精通」2.流程控制和错误处理
「JavaScript 从入门到精通」3.循环和迭代
「JavaScript 从入门到精通」4.函数
「JavaScript 从入门到精通」5.表达式和运算符
「JavaScript 从入门到精通」6.数字
「JavaScript 从入门到精通」7.时间对象
「JavaScript 从入门到精通」8.字符串
「JavaScript 从入门到精通」9.正则表达式
「JavaScript 从入门到精通」10.数组
「JavaScript 从入门到精通」11.Map和Set对象
「JavaScript 从入门到精通」12.使用对象
「JavaScript 从入门到精通」13.迭代器和生成器
「JavaScript 从入门到精通」14.元编程
「JavaScript 从入门到精通」15.JS对象介绍
「JavaScript 从入门到精通」16.JSON对象介绍
「JavaScript 从入门到精通」17.闭包
「JavaScript 从入门到精通」18.WebApi介绍