详解JavaScript中的Object.is()与"==="运算符总结

三重相等运算符 === 严格检查2个值是否相同:

1 === 1;  // => true
1 === '1'; // => false
1 === true; // => false

但是,ES2015规范引入了 Object.is(),其行为与严格的相等运算符几乎相同:

Object.is(1, 1);  // => true
Object.is(1, '1'); // => false
Object.is(1, true); // => false

主要问题是:什么时候使用 Object.is() 代替严格的相等性检查?让我们找出答案。

1.严格相等检查操作符

首先,让我们快速回顾一下严格的相等运算符是如何工作的。
当两个值的类型相同且持有相同的值时,严格相等检查运算符的计算结果为 true。
例如,以下原始值是相等的,因为它们是相同的类型且具有相同的值:

1     === 1;     // => true
'abc'   === 'abc';   // => true
true   === true;   // => true
null   === null;   // => true
undefined === undefined; // => true

严格相等运算符不执行类型的强制转换,即使操作符持有合理的相同值,但是不同类型的操作符,它们也不是严格相等的:

1  === '1';    // => false
1  === true;   // => false
null === undefined; // => false

对对象执行严格相等检查时,对象仅与自身严格相等:

const myObject = { prop: 'Value' };
myObject === myObject; // => true

即使2个对象的属性和值完全相同,它们的值也不同:

const myObject1 = { prop: 'Value' };
const myObject2 = { prop: 'Value' };
myObject1 === myObject2; // => false

以上比较方案在 Object.is(valueA,valueB) 中的工作原理完全相同。

严格相等检查和 Object.is() 之间的区别在于,如何处理 NaN 和如何处理负零 -0。

首先,NaN(非数字)并不严格等于任何其他值,即使使用另一个 NaN:

NaN === NaN; // => false
NaN === 1;  // => false

其次,严格相等运算符不能将 -0 与 +0 区分开:

-0 === +0; // => true

严格相等运算符使用严格相等比较算法。http://www.ecma-international.org/ecma-262/7.0/index.html#sec-strict-equality-comparison

2. Object.is()

Object.is(valueA,valueB) 以与严格相等运算符相同的方式检查相等性的参数,但有两个区别。

首先,NaN 等于另一个 NaN 值:

Object.is(NaN, NaN); // => true
Object.is(NaN, 1);  // => false

其次,Object.is() 区分 -0 和 +0:

Object.is(-0, +0); // => false

与严格相等运算符相比,Object.is() 使用相同值比较算法。http://www.ecma-international.org/ecma-262/7.0/index.html#sec-samevalue

总结

在大多数情况下,严格相等运算符是比较值的好方法。

如果你想直接检查 NaN 值或对负零和正零进行更严格的区分,那么 Object.is() 是一个不错的选择。

Object.is() 作为比较值的函数性方法也很有用,例如在函数式编程中。

来源:dmitripavlutin.com,作者:Dmitri Pavlutin,翻译:公众号《前端全栈开发者》

到此这篇关于详解JavaScript中的Object.is()与"==="运算符总结的文章就介绍到这了,更多相关JavaScript中的Object.is()与"==="运算符内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

时间: 2020-06-16

实例分析JS中的相等性判断===、 ==和Object.is()

相信刚接触JS的人都会被他的想等性判断给整糊涂,看看下面代码,你能答对几个? NaN === NaN // false NaN == NaN // false Object.is(NaN, NaN) // true 0 == false // true 1 == true // true Number(null) === 0 // true null == 0 // false Javascript提供了三种不同的值比较操作,分别是严格相等.宽松相等.以及Object.is,希望看完下面的内容,

实例分析javascript中的异步

js 异步解析 一 .js单线程分析 我们都知道js的一大特点是单线程,也就是同一时间点,只能处理一件事,一句js代码.那为什么js要设计成单线程而不是多线程呢?这主要和js的用途有关,js作为浏览器端的脚本语言,主要的用途为用户与服务端的交互与操作dom.而操作dom就注定了js只能是单线程语言.假如js才取多线程将会出现,多个线程同时对一个dom进行操作的情况,浏览器将无法判断如何渲染.不仅js是单线程,浏览器渲染dom也是单线程的,js的执行和浏览器渲染dom共用的一个线程,这就导致了在h

实例分析JS与Node.js中的事件循环

这两天跟同事同事讨论遇到的一个问题,js中的event loop,引出了chrome与node中运行具有setTimeout和Promise的程序时候执行结果不一样的问题,从而引出了Nodejs的event loop机制,记录一下,感觉还是蛮有收获的 console.log(1) setTimeout(function() { new Promise(function(resolve, reject) { console.log(2) resolve() }) .then(() => { con

实例分析浏览器中“JavaScript解析器”的工作原理

浏览器在读取HTML文件的时候,只有当遇到<script>标签的时候,才会唤醒所谓的"JavaScript解析器"开始工作. JavaScript解析器工作步骤: 1."找一些东西": var. function. 参数:(也被称之为预解析) 备注:如果遇到重名分为以下两种情况: 遇到变量和函数重名了,只留下函数 遇到函数重名了,根据代码的上下文顺序,留下最后一个 2.逐行解读代码. 备注:表达式可以修改预解析的值 JS解析器在执行第一步预解析的时候,会

实例分析js事件循环机制

本文通过实例给大家详细分析了JS中事件循环机制的原理和用法,以下是全部内容: var start = new Date() setTimeout(function () { var end = new Date console.log('Time elapsed:', end - start, 'ms') }, 500) while (new Date() - start < 1000) { } 有其他语言能完成预期的功能吗?Java, 在Java.util.Timer中,对于定时任务的解决方案

一道优雅面试题分析js中fn()和return fn()的区别

在js中,经常会遇到在函数里调用其它函数的情况,这时候会有 fn() 这种调用方式,还有一种是 return fn() 这种调用方式,一些初学者经常会被这两种方式给绕晕了.这里用一个优雅的面试题来分析一下两种方式的不同之处. var i = 0; function fn(){ i++; if(i < 10){ fn(); }else{ return i; } } var result = fn(); console.log(result); 这是一道隐藏了坑的面试题,看似很简单,大部分人可能想都

实例讲解JS中setTimeout()的用法

本文实例讲解了JS中setTimeout()的用法,分享给大家供大家参考,具体内容如下 效果图: 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"&

实例分析javascript中的call()和apply()方法

1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象. 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj. apply方法: 语法:apply([thisObj[,argArray]])

分析JS中this引发的bug

在 js 中,this 这个上下文总是变化莫测,很多时候出现bug 总是一头雾水,其实,只要分清楚不同的情况下如何执行就可以了,以下就是我们给大家整理的相关内容: 在JavaScript中有一个很特别.很常用又常常让初学者很困扰的东西 ─ "this",在这堂课中会来谈谈这个"this". this通常会指向一个对象,同时this会在不同的情境下指向不同的对象.让我们来看几个不同的情境,帮助我们更了解"this". window object (

实例分析js和C#中使用正则表达式匹配a标签

废话不多说,都在代码中,直接上 JS代码: 复制代码 代码如下: <html> <head> <script language="javascript">     var a='<P><A href=\'~abc/ccg/ab.jpg\' width="3">文字</A><A width="4" style="color:#ddd; font-weight:b