JavaScript 中的相等操作符 ( 详解 [] == []、[] == ![]、{} == !{} )
ECMAScript 中的相等操作符由两个等于号 ( == ) 表示,如果两个操作数相等,则返回 true。
相等操作符会先转换操作数(通常称为强制转型),然后比较它们的相等性。
在转换不同的数据类型时,相等操作符遵循下列基本规则:
1. 如果有一个操作数是布尔值,则在比较相等性之前,将其转换为数值;
2. 如果一个操作数是字符串,另一个操作数是数值,在比较之前先将字符串转换为数值;
3. 如果一个操作数是对象,另一个操作数不是,则调用对象的 valueOf() 方法,用得到的基本类型值按照前面的规则进行比较;
4. 如果有一个操作数是 NaN,无论另一个操作数是什么,相等操作符都返回 false;
5. 如果两个操作数都是对象,则比较它们是不是同一个对象。如果指向同一个对象,则相等操作符返回 true;
6. 在比较相等性之前,不能将 null 和 undefined 转成其他值。
7. null 和 undefined 是相等的。
以上内容摘自《 JavaScript 高级程序设计(第3版)》3.5.7
一、基本规则
上面阐述的 1、2、3 三条规则,总结成一句话就是:
如果相等操作符两边的操作数,不包含 null 或者 undefined,且两个操作数不全是对象,
在执行相等比较之前,会先调用 Number() 将两个操作数强制转为 Number 类型,然后进行比较
所以在使用相等操作符的时候,会有以下情况:
'55' == 55; //true
false == 0; //true
"wise" == 3; //false ( Number("wise") -> NaN )
[] == 0; //true ( Number([]) -> 0 )
但是在特殊情况下,也就是两边都有对象的时候,会产生看似不合理的结果:
NaN == NaN; //false (参考第4条规则)
[] == []; //false
[] == ![]; //true
{} == {}; //false
{} == !{}; //false
二、[] == [] 和 {} == {}
在 JavaScript 中,Object、Array、Function、RegExp、Date 都是引用类型
声明引用类型的时候,变量名保存在 js 的栈内存里面,而对应的值保存在堆内存里面
而这个变量在栈内存中实际保存的是:这个值在堆内存中的地址,也就是指针
var a = {};
var b = {};
上面的代码中,声明变量 a 的时候,在堆内存中存储了一个 Object,而 a 实际保存的这个 Object 的地址
然后声明变量 b 的时候,又存储了一个新的 Object
虽然 a 和 b 都保存了一个 Object,但这是两个独立的 Object,它们的地址是不同的
再结合前面的第5条规则:如果两个对象指向同一个对象,相等操作符返回 true
所以 {} == {} 的结果是 false,同样的, [] == [] 的结果也是 false
var c = b;
b == c; //true(变量c保存的是b的指针,它们指向同一个对象)
三、[] == ![] 和 {} == !{}
参考链接:JavaScript 运算符优先级
ECMAScript 中规定,逻辑非 (!) 的优先级高于相等操作符 ( == )
在比较 [] == ![] 的时候,先计算 ![] 得到布尔值 false
所以实际上比较的是 [] == false
然后根据上面的第1条规则和第3条规则,将两个操作数转为数值类型:
Number([]) == Number(false); // -> 0 == 0 -> true
在比较 {} == !{} 的时候,也是遵守同样的规则:
{} == !{} -> {} == false -> Number({}) == Number(false) -> NaN == 0
然后第4条规则规定:如果有一个操作数是 NaN,相等操作符返回 false
所以 {} == !{} 的结果是 false
JavaScript 中的相等操作符 ( 详解 [] == []、[] == ![]、{} == !{} )的更多相关文章
- javascript中=、==、===区别详解
javascript中=.==.===区别详解今天在项目开发过中发现在一个小问题.在判断n==""结果当n=0时 n==""结果也返回了true.虽然是个小问题 ...
- JavaScript中return的用法详解
JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 t ...
- javascript 中合并排序算法 详解
javascript 中合并排序算法 详解 我会通过程序的执行过程来给大家合并排序是如何排序的... 合并排序代码如下: <script type="text/javascript& ...
- javascript中的this作用域详解
javascript中的this作用域详解 Javascript中this的指向一直是困扰我很久的问题,在使用中出错的机率也非常大.在面向对象语言中,它代表了当前对象的一个引用,而在js中却经常让我觉 ...
- JavaScript中this的用法详解
JavaScript中this的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 thi ...
- JavaScript中数组Array方法详解
ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...
- Javascript中prototype属性的详解
原文链接:http://www.cnblogs.com/Uncle-Keith/p/5834289.html 在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象 ...
- JavaScript中的注释问题详解? 部分3
注释:解释代码的含义,浏览器中不执行. 方便其他程序员了解代码 ,也可以注释自己不需要的代码(开发过程中)! 1. 单行注释 // 用于一行代码上面 2.多行注释 /* */ 用于一段代码上面 或者是 ...
- JavaScript中的async/await详解
1.前言 async函数,也就是我们常说的async/await,是在ES2017(ES8)引入的新特性,主要目的是为了简化使用基于Promise的API时所需的语法.async和await关键字 ...
随机推荐
- 实用:Git 中的一些常见错误
无论是数据科学家.算法工程师还是普通开发人员,在每个团队协作开发任务中,Git 都是必不可少的版本控制工具,因此掌握它的基本操作十分有必要.但即便是教程满天飞的今天,开发人员在使用 Git 时也还是会 ...
- Android开发技术周报183学习记录
Android开发技术周报183学习记录 教程 Android性能优化来龙去脉总结 记录 一.性能问题常见 内存泄漏.频繁GC.耗电问题.OOM问题. 二.导致性能问题的原因 1.人为在ui线程中做了 ...
- JDK设计模式之——责任链(Filter)
责任链的设计模式可以参考Servlet的FilterChain.FilterChain中的每个Filter(过滤器)就像一个个的链条 web开发中 有时候需要对接口request和response进行 ...
- SpringMVC框架四:异常处理器
.异常分为:预期异常.运行时异常 dao.service.controller三层中有异常,依次向上抛出直到SpringMVC处理. 而SpringMVC交给HandlerExceptionResol ...
- MySQL:刷脏页
1. 脏页,干净页 当内存数据页和磁盘数据页上的内容不一致时,我们称这个内存页为脏页: 内存数据写入磁盘后,内存页上的数据和磁盘页上的数据就一致了,我们称这个内存页为干净页. 2. 刷脏页的时机 2. ...
- Spring详解(七)------AOP 注解
上一篇博客我们讲解了 AspectJ 框架如何实现 AOP,然后具体的实现方式我们是通过 xml 来进行配置的.xml 方式思路清晰,便于理解,但是书写过于麻烦.这篇博客我们将用 注解 的方式来进行 ...
- jQuery之animate()用法
最近在学习jQuery,看到一个很有意思的函数animate(),但是在网上却没有查到相关的详细资料,于是打算参考jQuery API,自己总结一下. 概述 animate() 方法执行 CSS 属性 ...
- Linux 系统下实践 VLAN
本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. 01 准备环境 ...
- Mybatis 使用备忘录
自动生成Mapper java -jar mybatis-generator-core-1.3.2.jar -configfile generatorConfig.xml -overwrite Myb ...
- 图片预览(适用于IE6,9,10,Firefox)
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...