JavaScript 中的双等号(==)和三等号(===)有何不同?何时使用它们?

​🌈个人主页:前端青山
🔥系列专栏:JavaScript篇
🔖人终将被年少不可得之物困其一生

依旧青山,本期给大家带来JavaScript篇专栏内容:JavaScript-等号区别

目录

== 和 ===区别,分别在什么情况使用

一、等于操作符

二、全等操作符

三、区别

小结

== 和 ===区别,分别在什么情况使用

一、等于操作符

等于操作符用两个等于号( == )表示,如果操作数相等,则会返回 true

前面文章,我们提到在JavaScript中存在隐式转换。等于操作符(==)在比较中会先进行类型转换,再确定操作数是否相等

遵循以下规则:

如果任一操作数是布尔值,则将其转换为数值再比较是否相等

let result1 = (true == 1); // true

如果一个操作数是字符串,另一个操作数是数值,则尝试将字符串转换为数值,再比较是否相等

let result1 = ("55" == 55); // true

如果一个操作数是对象,另一个操作数不是,则调用对象的 valueOf()方法取得其原始值,再根据前面的规则进行比较

let obj = {valueOf:function(){return 1}}
let result1 = (obj == 1); // true

nullundefined相等

let result1 = (null == undefined ); // true

如果有任一操作数是 NaN ,则相等操作符返回 false

let result1 = (NaN == NaN ); // false

如果两个操作数都是对象,则比较它们是不是同一个对象。如果两个操作数都指向同一个对象,则相等操作符返回true

let obj1 = {name:"xxx"}
let obj2 = {name:"xxx"}
let result1 = (obj1 == obj2 ); // false

下面进一步做个小结:

  • 两个都为简单类型,字符串和布尔值都会转换成数值,再比较

  • 简单类型与引用类型比较,对象转化成其原始类型的值,再比较

  • 两个都为引用类型,则比较它们是否指向同一个对象

  • null 和 undefined 相等

  • 存在 NaN 则返回 false

二、全等操作符

全等操作符由 3 个等于号( === )表示,只有两个操作数在不转换的前提下相等才返回 true。即类型相同,值也需相同

let result1 = ("55" === 55); // false,不相等,因为数据类型不同
let result2 = (55 === 55); // true,相等,因为数据类型相同值也相同

undefinednull 与自身严格相等

let result1 = (null === null)  //true
let result2 = (undefined === undefined)  //true

三、区别

相等操作符(==)会做类型转换,再进行值的比较,全等运算符不会做类型转换

let result1 = ("55" === 55); // false,不相等,因为数据类型不同
let result2 = (55 === 55); // true,相等,因为数据类型相同值也相同

nullundefined 比较,相等操作符(==)为true,全等为false

let result1 = (null == undefined ); // true
let result2 = (null  === undefined); // false

小结

相等运算符隐藏的类型转换,会带来一些违反直觉的结果

'' == '0' // false
0 == '' // true
0 == '0' // true
​
false == 'false' // false
false == '0' // true
​
false == undefined // false
false == null // false
null == undefined // true
​
' \t\r\n' == 0 // true

但在比较null的情况的时候,我们一般使用相等操作符==

const obj = {};
​
if(obj.x == null){console.log("1");  //执行
}

等同于下面写法

if(obj.x === null || obj.x === undefined) {...
}

使用相等操作符(==)的写法明显更加简洁了

所以,除了在比较对象属性为null或者undefined的情况下,我们可以使用相等操作符(==),其他情况建议一律使用全等操作符(===)

双等号 "==" 运算符用于比较两个值是否相等。在使用双等号进行比较时,JavaScript 会在必要时进行类型转换,然后再比较这两个值。这意味着,即使两个值的类型不同,双等号也会尝试将它们转换为相同的类型,然后再进行比较。例如:"1" == 1 这个表达式会返回 true,因为 JavaScript 将字符串 "1" 转换为数字 1 后再进行比较。

三等号 "===" 运算符也用于比较两个值是否相等,但它不会进行类型转换。如果两个值的类型不同,直接返回 false。例如:"1" === 1 这个表达式会返回 false,因为一个是字符串,一个是数字,它们的类型不同。

推荐在大多数情况下使用 "===" 运算符进行严格的值比较,因为它不会进行类型转换,可以避免一些潜在的错误。只有在明确知道两个值的类型,并且希望进行类型转换后再比较时,才应该使用 "==" 运算符。

总之,了解 "==" 和 "===" 运算符的区别,以及在什么情况下使用它们,可以帮助开发者编写更可靠的 JavaScript 代码。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/578635.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

交换机端口镜像技术原理与配置

在网络维护的过程中会遇到需要对报文进行获取和分析的情况,比如怀疑有攻击报文,此时需要在不影响报文转发的情况下,对报文进行获取和分析。镜像技术可以在不影响报文正常处理流程的情况下,将镜像端口的报文复制一份到观察端口&…

掌握ElasticSearch(一):Elasticsearch安装与配置、Kibana安装

文章目录 〇、简介1.Elasticsearch简介2.典型业务场景3.数据采集工具4.名词解释 一、安装1.使用docker(1)创建虚拟网络(2)Elasticsearch安装步骤 2.使用压缩包 二、配置1.目录介绍2.配置文件介绍3.elasticsearch.yml节点配置4.jvm.options堆配置 二、可视化工具Kibana1.介绍2.安…

AI数字人互动大屏采用什么技术?

互动大屏(技术支持:zhibo175)本身具有令人瞩目的效果,再配置丰富多彩的多媒体,如引人注目的广告、特效或游戏等,可起到很好的引流作用。在空间开阔且客流密集的场所,使用各种形态的大面积屏幕&a…

轻量级开源服务器Tomcat本地部署并将网页发布到公网远程访问

目录 1.前言 2.本地Tomcat网页搭建 2.1 Tomcat安装 2.2 配置环境变量 2.3 环境配置 2.4 Tomcat运行测试 2.5 Cpolar安装和注册 3.本地网页发布 3.1.Cpolar云端设置 3.2 Cpolar本地设置 4.公网访问测试 5.结语 前些天发现了一个巨牛的人工智能学习网站,通…

小型洗衣机哪个牌子质量好?口碑最好的四款小型洗衣机推荐

随着科技的快速发展,现在的人们越来越注重自己的卫生问题,不仅在吃上面会注重卫生问题,在用的上面也会更加严格要求,而衣服做为我们最贴身的东西,我们对它的要求也会更加高,所以最近这几年较火爆的无疑是内…

微信服务号变成订阅号全流程攻略

服务号和订阅号有什么区别?服务号转为订阅号有哪些作用?我们都知道,服务号一个月只能发4次文章,但是订阅号每天都能发文章。不过在接收消息这一方面,服务号群发的消息有消息提醒,并显示在对话框&#xff1b…

FC忍者神龟格斗可视化hack源码

[FC][忍者神龟格斗][最佳可视化][Final] 时间:2023.12.22 作者:FlameCyclone 内容: 1.可视化功能菜单 (1)菜单按键操作 1.上下键: 移动选项 2.左右键: 翻页 3.选择键: 翻转功能开关 4.开始键: 退出菜单 5.B键: 启用功能 …

143.【Nginx-02】

Nginx-02 (五)、Nginx负载均衡1.负载均衡概述2.负载均衡的原理及处理流程(1).负载均衡的作用 3.负载均衡常用的处理方式(1).用户手动选择(2).DNS轮询方式(3).四/七层负载均衡(4).Nginx七层负载均衡指令 ⭐(5).Nginx七层负载均衡的实现流程 ⭐ 4.负载均衡状态(1).down (停用)(2)…

小学班委有哪些职位

在成长的道路上,班委是一个不可或缺的角色。它不仅是一个职位,更是一份责任和担当。对于孩子们来说,成为班委不仅意味着荣誉,更意味着在集体中发挥自己的力量,为班级做贡献。 那么,小学班委有哪些职位呢&am…

配置Nginx出现403 (Forbidden)静态文件加载不出来

出现问题如图 出现此问题可能和索引文件缺失、访问限制等原因有关,在默认的Nginx的配置中,出现此问题的大概率问题可能出现在启动用户和nginx工作用户不一致所致。 Nginx的默认配置文件的 nginx.conf 里首行是 user www-data; 如果你是在 root 下启用…

基于JAVA实现的简易学生信息管理系统(附源码)

一、前言 最近在学习JAVA,这几天跟着网上的视频学完基础知识之后,做了一个学生信息管理系统,写的比较普通,没太大亮点,希望可以给初学者一些参考经验,另外,如有不恰当的地方还请各位指正&am…

浅谈智能型电动机保护器在也门化工行业的应用

1.背景信息Background 现代化工工业中,电动机作为一种拖动机械,成为所有动力机械基础,科学技术不断进步和工艺控制不断完善,尤其是自动化生产要求,迫切需要开发和完善电动机控制和保护设备,实现对生产过程…

卫星接收LNBs的专用电路

都具有FET偏置控制器电路的卫星接收器LNB电路 芯片的描述:D3211是一-块用于卫星接收LNBs的专用电路,具有极化电压检测切换、22KHz脉冲检测切换和提供高放、本振级GaAs或HEMT FET晶体管工作点偏置等功能。D321 1内部的22K检测及切换控制由22K有源滤波器、…

一文带你深入浅出Web的自动化测试工具Selenium【建议收藏】

文章目录 前言发现宝藏第01节 Selenium概述第02节 安装浏览器驱动(以Google为例)第03节 定位页面元素1. 打开指定页面2. id 定位3. name 定位4. class 定位5. tag 定位6. xpath 定位7. css 选择器8. link 定位9. 示例 有道翻译 第04节 浏览器控制1. 修改…

重装系统后桌面图标没有了,“此电脑”怎么添加?

重装电脑系统对于使用电脑的用户来说是一种很常见的操作。但是有时在重装系统之后,我们会发现电脑桌面图标不见了,那么这时该怎么办呢?“此电脑”该怎么添加呢? 解决方法: 1.在桌面空白处单击鼠标右键,选择…

绝地反击,不做背锅侠!

那么作为运维人员,如何摆脱以上背黑锅的尴尬局面呢?堡垒机当然是破解此局面的绝杀大招。 1.统一登录入口 提供统一入口,集中管理和分配账户密码、所有运维人员只能登录堡垒机才能访问服务器,梳理“人与服务器”之间的关系&#…

C++设计模式 #7 工厂方法(Factory Method)

“对象创建”模式 通过“对象创建”模式绕开new,来避免对象创建(new)过程中所导致的紧耦合(依赖具体类),从而支持创建的稳定。它是接口抽象之后的第一步工作。 动机 在软件系统中,经常面临着创…

全球市场拓展指南:出海企业品牌力觉醒与长期主义引领

近年来,随着全球化的深入推进,越来越多的企业纷纷踏上了出海之路,希望在国际市场中寻找新的增长点。然而,仅仅依靠产品和服务的优势已经不能满足出海企业在激烈的国际市场竞争中立于不败之地。在这个背景下,企业们慢慢…

英特尔A770显卡介绍与解读

基础介绍 英特尔A770显卡。这是英特尔推出的一款高性能显卡,属于他们的Arc系列。这个系列的显卡主要面向游戏玩家和专业内容创作者,提供高性能图形处理能力。 A770显卡配备了先进的特性,例如支持硬件级光线追踪、AI加速技术,以及…