0

0

详解js中==、===以及Object.js()的内容(全面)

不言

不言

发布时间:2018-09-17 15:02:21

|

1586人浏览过

|

来源于php中文网

原创

本篇文章给大家带来的内容是关于详解js中==、===以及object.js()的内容(全面),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

本文主要讲解JavaScript中的三种相等运算:==,===和Object.js()。通过对比和例子,加深大家的印象,并就个别例子进行详细说明。

预备知识

详解ECMAScript7规范中ToPrimitive抽象操作的知识(示例)

===运算符

对于x === y,该运算符的比较步骤如下:

1、如果x的类型和y的类型不一样,返回false;

2、如果x的类型是数字,那么:

a、如果x是NaN,返回false;

b、如果y是NaN,返回false;

c、如果x和y是同一个数字值,返回true;

d、如果x是+0,y是-0,返回true;

e、如果x是-0,y是+0,返回true;

f、返回false;

3、返回SameValueNonNumber(x, y)的结果。

SameValueNonNumber(x, y)抽象操作比较两个非数字并且同类型的x和y是否相等,比较步骤如下:

1、如果x的类型是null或者undefined,返回true;

2、如果x是字符串类型,

如果x和y是完全相同的字符编码序列,返回true,否则返回false;

3、如果x是布尔类型,

4、如果x和y同为true或者false,返回true,否则返回false;

5、如果x是symbol类型,

如果x和y是相同的符号值,返回true,否则返回false;

6、如果x和y是同一个对象值,返回true,否则返回false。

需要注意的点是NaN,+0,-0:

NaN === NaN // false
+0 === -0 // true
-0 === +0 // true

这三个例子分别对应x === y比较步骤中的2.1,2.4和2.5。这三个例子的输出结果完全就是按照规范的定义得出的结果,没有为什么,规范就是这么定义的。至于说为什么规范要这样定义,可能就需要去问规范的制定者了,这个就不在本文的讨论范围之内了。

Object.is()

对于Object.is(x, y),会使用抽象操作SameValue(x, y)进行比较,该抽象操作的步骤如下:

1、如果x的类型和y的类型不一样,返回false;

2、如果x的类型是数字,那么:

a、如果x和y都是NaN,返回true;

b、如果x是+0,y是-0,返回false;

c、如果x是-0,y是+0,返回false;

d、如果x和y是同一个数字值,返回true;

e、返回false;

3、返回SameValueNonNumber(x, y)的结果。

由此可见,===和Object.is()的区别在于对NaN和带符号的0的处理:

NaN === NaN // false
+0 === -0 // true
-0 === +0 // true
Object.is(NaN, NaN) // true
Object.is(+0, -0) // false
Object.is(-0, +0) // false

==运算符

对于x == y,该运算符的比较步骤如下:

1、如果x和y的类型相同,返回x === y的结果;

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

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

php商城系统
php商城系统

PHP商城系统是国内功能优秀的网上商城系统,同时也是一个商业的PHP开发框架,有多套免费模版,强大的后台管理功能,专业的网上商城系统解决方案,快速建设网上购物商城、数码商城、手机商城、办公用品商城等网站。 php商城系统v3.0 rc6升级 1、主要修复用户使用中出现的js未加载完报错问题,后台整改、以及后台栏目的全新部署、更利于用户体验。 2、扩展出,更多系统内部的功能,以便用户能够迅速找到需

下载

4、如果x的类型是数字,y的类型是字符串,返回x == ToNumber(y)的结果;

5、如果x的类型是字符串,y的类型是数字,返回ToNumber(x) == y的结果;

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

7、如果y的类型是布尔类型,返回x == ToNumber(y)的结果;

8、如果x的类型是字符串、数字或者Symbol中的一种,y的类型是对象,返回x == ToPrimitive(y)的结果;

9、如果x的类型是对象,y的类型是字符串、数字或者Symbol中的一种,返回ToPrimitive(x) == y的结果;

10、返回false。

上面用到了方法ToNumber,ToNumber(x)的步骤如下:

1、如果x的类型是Undefined,返回NaN;

2、如果x的类型是Null,返回+0;

3、如果x的类型是布尔类型,x为true返回1,false返回+0;

4、如果x的类型是数字,返回x;

5、如果x的类型是字符串,参考字符串转化为数字,本文不详细介绍这块内容;

6、如果x的类型是Symbol,返回NaN;

7、如果x的类型是对象,

a、让primValue的值是ToPrimitive(x, hint Number);

b、返回ToNumber(primValue)的结果;

[] == ![]

上面讲了==运算符的比较步骤,下面我们讲一个例子加深下印象:

[] == ![]

首先左边的[]是一个空数组,类型是对象,右边是![],[]是一个真值,所以![]的结果是false:

[] == ![] // => [] == false

然后会走到x == y比较步骤的第7步,返回x == ToNumber(y)的结果,也就是:

[] == false // => [] == ToNumber(false)

由ToNumber(x)的第3步可知,ToNumber(false)返回+0:

[] == ToNumber(false) // => [] == +0

然后走到x == y比较步骤的第9步,返回ToPrimitive(x) == y的比较结果:

[] == +0 // => ToPrimitive([]) == +0

ToPrimitive([])的结果是空字符串"",原因请查看文章ECMAScript7规范中的ToPrimitive抽象操作。所以,上面等价于:

"" == +0

然后走到x == y比较步骤的第5步,返回ToNumber(x) == y的结果:

"" == +0 // => ToNumber("") == +0

由ToNumber操作的第5步可知,ToNumber("")的结果是+0,所以也就是:

+0 == +0 // true

{} == !{}

首先,左边是{},类型是对象,右边是!{},{}是真值,所以!{}是false:

{} == !{} // => {} == false

然后同样会走到x == y比较步骤的第7步,返回x == ToNumber(y)的结果,也就是:

{} == false // => {} == ToNumber(false)

由ToNumber(x)的第3步可知,ToNumber(false)返回+0:

{} == ToNumber(false) // => {} == +0

然后走到x == y比较步骤的第9步,返回ToPrimitive(x) == y的比较结果:

{} == +0 // => ToPrimitive({}) == +0

ToPrimitive({})的结果是字符串"[object Object]",原因请查看文章ECMAScript7规范中的ToPrimitive抽象操作。所以,上面等价于:

"[object Object]" == +0

然后走到x == y比较步骤的第5步,返回ToNumber(x) == y的结果:

"[object Object]" == +0 // => ToNumber("[object Object]") == +0

由ToNumber操作的第5步可知,ToNumber("[object Object]")的结果是NaN,所以也就是:

NaN == +0 // false

所以,[] == ![]的结果是true,{} == !{}的结果是false。可能有人第一次看到[] == ![]的时候,觉得这个的比较结果怎么可能是true。我觉得有时候不要感性的去认识问题,按照规定的运算步骤走一遍,结果是什么就是什么。

总结

本文讲解了JavaScript中的三种相等运算:==,===和Object.js(),希望对大家有所帮助。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

14

2026.01.30

c++ 字符串格式化
c++ 字符串格式化

本专题整合了c++字符串格式化用法、输出技巧、实践等等内容,阅读专题下面的文章了解更多详细内容。

9

2026.01.30

java 字符串格式化
java 字符串格式化

本专题整合了java如何进行字符串格式化相关教程、使用解析、方法详解等等内容。阅读专题下面的文章了解更多详细教程。

12

2026.01.30

python 字符串格式化
python 字符串格式化

本专题整合了python字符串格式化教程、实践、方法、进阶等等相关内容,阅读专题下面的文章了解更多详细操作。

4

2026.01.30

java入门学习合集
java入门学习合集

本专题整合了java入门学习指南、初学者项目实战、入门到精通等等内容,阅读专题下面的文章了解更多详细学习方法。

20

2026.01.29

java配置环境变量教程合集
java配置环境变量教程合集

本专题整合了java配置环境变量设置、步骤、安装jdk、避免冲突等等相关内容,阅读专题下面的文章了解更多详细操作。

18

2026.01.29

java成品学习网站推荐大全
java成品学习网站推荐大全

本专题整合了java成品网站、在线成品网站源码、源码入口等等相关内容,阅读专题下面的文章了解更多详细推荐内容。

19

2026.01.29

Java字符串处理使用教程合集
Java字符串处理使用教程合集

本专题整合了Java字符串截取、处理、使用、实战等等教程内容,阅读专题下面的文章了解详细操作教程。

3

2026.01.29

Java空对象相关教程合集
Java空对象相关教程合集

本专题整合了Java空对象相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.6万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.1万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号