全网整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:400-708-3566

JavaScript中三个等号和两个等号你了解多少

引子

众所周知,用在if条件判断语句中,js有六种假值:false, null, undefined, '', NAN, 0。先来看几个例子:

[] === []
NaN === NaN
NaN == NaN
0 == []
'' == []
'' == {}
[] == undefined
{} == []
null == undefined

以上这些判断结果是什么,大家能否一看就知道结果呢?笔者以前对==和===都只有大概的印象,相信大家也都知道,== 判断如果两边变量的类型不同,会将其先做类型转换再作判断,而 === 则不做类型转换,如果类型不同,就一定返回 false。但是笔者最近看到了一个题目,感觉很有意思,贴出来给大家看看:

var x = 1;
var obj = {
  valueOf: function(){ 
    x = 2; 
    return 0 
    }
  }
console.log(obj == 0, x)

恩,这段代码输出的结果是 true, 2,是不是不可思议?还有~

var x = 1;
var obj = {
  valueOf: function(){ 
    return {} 
  }, 
  toString: function(){ 
    return {}
  }
 }
 console.log(obj == 0)

这段代码直接抛出了异常: Uncaught TypeError: Cannot convert object to primitive value。

如果你和我一样觉得很奇怪,那就继续往下看吧~

=== 的规则

这个比较简单,我把规则罗列一下

  1. 如果类型不同,就不相等
  2. 如果两个都是数值,并且是同一个值,那么相等,例外的是,如果其中至少一个是NaN,那么不相等。(判断一个值是否是 NaN,只能用isNaN() 来判断)
  3. 如果两个都是字符串,每个位置的字符都一样,那么相等;否则不相等。
  4. 如果两个值都是true,或者都是false,那么相等。
  5. 如果两个值都引用同一个对象或函数,那么相等;否则不相等。
  6. 如果两个值都是null,或者都是undefined,那么相等。

这里不难发现,复合类型的数据(比如对象、数组、函数等)之间的比较不是比较他们的值是否相等,而是比较他们引用的对象是否一样,因此也不难明白,为什么 [] === [] 判断为false了。

比如:

== 探究

看下 == 的规则

  1. 如果两个值类型相同,进行 === 比较。
  2. 如果两个值类型不同,他们可能相等。根据下面规则进行类型转换再比较:
  3. 如果一个是null、一个是undefined,那么相等。
  4. 如果一个是字符串,一个是数值,把字符串转换成数值再进行比较。
  5. 如果任一值是 true,把它转换成 1 再比较;如果任一值是 false,把它转换成 0 再比较。
  6. 如果一个是对象,另一个是数值或字符串,把对象转换成基础类型的值再比较。对象转换成基础类型,利用它的toString或者valueOf方法。 js核心内置类,会尝试valueOf先于toString。例外的是Date,Date利用的是toString转换。非js核心的对象,会比较麻烦,有兴趣的同学可以研究一下
  7. 任何其他组合,都不相等。

看到这里,第六条,我们就可以明白,为什么上面的代码会输出意想不到的结果甚至抛出错误了。

再来看一题:

if (x == 10) 
  x += 5

根据上面的规则,试想一下,如果我们输入的x是字符串20,那么x的结果会变成什么样?没错,就是205,而往往这种情况我们的目的是想计算20+5的值。

综合上面的例子,不难看出,== 的比较看似会比较方便,比如 1 == '1' ,但是会埋下隐患,比如可能对类型做出错误的假设。因此大多数人建议我们少用== 而尽量使用 ===,事实上我也推荐如果明确知道类型,还是最好用===。

再举个简单的例子:团队协作中你肯定需要读别人的代码。而当你看到==时,要判断清楚作者的代码意图是确实需要转型,还是无所谓要不要转型只是随手写了,还是不应该转型但是写错了……所花费的脑力和时间比明确的===(加上可能需要的明确转型)要多得多。这样一想,===不要好太多。

明白了==的机制,那么判断这6个假值,就变得容易了。

简单看看几个例子,大家看看是真是假~

false == ''
false == []
0 == []
'' == []
[] == []
[] == {}
null == undefined
false == undefined

总结

可以用一张图来表达 == 返回true的几个假值:

一、首先看双等号前后有没有NaN,如果存在NaN,一律返回false。

二、再看双等号前后有没有布尔,有布尔就将布尔转换为数字。(false是0,true是1)

三、接着看双等号前后有没有字符串, 有三种情况:

  1. 对方是对象,对象使用toString()或者valueOf()进行转换;
  2. 对方是数字,字符串转数字;
  3. 对方是字符串,直接比较;
  4. 其他返回false
  5. 如果是数字,对方是对象,对象取valueOf()或者toString()进行比较, 其他一律返回false
  6. null, undefined不会进行类型转换, 但它们俩相等

后记

我的建议是:如果你的的确确知道你在做什么(了解类型转换的结果),可以用==;否则还是用===吧。

在网上无意中看到的图,大家可以参考看看:

==号

===号


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


# JavaScript  # 三个等号  # JavaScript两个等号  # javascript中三个等号  # 浅析Javascript中双等号(==)隐性转换机制  # 细数JavaScript 一个等号  # 两个等号  # 三个等号的区别  # JavaScript中三个等号和两个等号的区别(== 和 ===)浅析  # 详解JavaScript中双等号引起的隐性类型转换  # javascript等号运算符使用详解  # javascript中的=等号个数问题两个跟三个有什么区别  # 浅析js中2个等号与3个等号的区别  # javascript 全等号运算符使用说明  # 浅谈JavaScript中等号、双等号、 三等号的区别  # 都是  # 转换成  # 的是  # 几个  # 布尔  # 可以用  # 把它  # 这段  # 其先  # 不相等  # 抛出  # 我也  # 他们的  # 如果你  # 都不  # 太多  # 那就  # 就不  # 你在  # 做什么 


相关文章: 高端企业智能建站程序:SEO优化与响应式模板定制开发  高性能网站服务器配置指南:安全稳定与高效建站核心方案  成都品牌网站制作公司,成都营业执照年报网上怎么办理?  邀请函制作网站有哪些,有没有做年会邀请函的网站啊?在线制作,模板很多的那种?  香港代理服务器配置指南:高匿IP选择、跨境加速与SEO优化技巧  魔方云NAT建站如何实现端口转发?  建站之星五站合一营销型网站搭建攻略,流量入口全覆盖优化指南  如何在服务器上三步完成建站并提升流量?  车管所网站制作流程,交警当场开简易程序处罚决定书,在交警网站查询不到怎么办?  如何在Golang中使用encoding/gob序列化对象_存储和传输数据  手机网站制作与建设方案,手机网站如何建设?  如何通过远程VPS快速搭建个人网站?  如何快速搭建高效香港服务器网站?  韩国服务器如何优化跨境访问实现高效连接?  如何确保FTP站点访问权限与数据传输安全?  h5网站制作工具有哪些,h5页面制作工具有哪些?  制作门户网站的参考文献在哪,小说网站怎么建立?  香港服务器租用每月最低只需15元?  盐城做公司网站,江苏电子版退休证办理流程?  如何在IIS管理器中快速创建并配置网站?  零服务器AI建站解决方案:快速部署与云端平台低成本实践  高性价比服务器租赁——企业级配置与24小时运维服务  建站之星如何助力网站排名飙升?揭秘高效技巧  如何安全更换建站之星模板并保留数据?  c++怎么使用类型萃取type_traits_c++ 模板元编程类型判断【方法】  网站制作知乎推荐,想做自己的网站用什么工具比较好?  ,在苏州找工作,上哪个网站比较好?  C++如何使用std::optional?(处理可选值)  网站制作多少钱一个,建一个论坛网站大约需要多少钱?  如何在宝塔面板中创建新站点?  深圳网站制作的公司有哪些,dido官方网站?  怎么将XML数据可视化 D3.js加载XML  广州网站制作的公司,现在专门做网站的公司有没有哪几家是比较好的,性价比高,模板也多的?  javascript中的try catch异常捕获机制用法分析  建站之星如何修改网站生成路径?  实惠建站价格推荐:2025年高性价比自助建站套餐解析  网站制作说明怎么写,简述网页设计的流程并说明原因?  网站企业制作流程,用什么语言做企业网站比较好?  C#怎么使用委托和事件 C# delegate与event编程方法  广州营销型建站服务商推荐:技术优势与SEO优化解析  网站制作外包价格怎么算,招聘网站上写的“外包”是什么意思?  网站制作大概多少钱一个,做一个平台网站大概多少钱?  建站之星安装后如何配置SEO及设计样式?  建站之星如何取消后台验证码生成?  如何快速搭建高效WAP手机网站吸引移动用户?  建站DNS解析失败?如何正确配置域名服务器?  广州商城建站系统开发成本与周期如何控制?  公司门户网站制作公司有哪些,怎样使用wordpress制作一个企业网站?  网站制作报价单模板图片,小松挖机官方网站报价?  如何制作算命网站,怎么注册算命网站? 

您的项目需求

*请认真填写需求信息,我们会在24小时内与您取得联系。