前端JavaScript中的 == 和 ===区别,以及他们的应用场景,快来看看吧,积累一点知识。

news2024/12/30 2:47:33

 🎬 江城开朗的豌豆个人主页

 🔥 个人专栏 :《 VUE 》 《 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

null undefined相等

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

下面进一步做个小结:

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

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

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

  • nullundefined 相等

  • 存在 NaN 则返回 false

二、全等操作符

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

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

undefined 和 null 与自身严格相等

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

三、区别

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

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

null 和 undefined 比较,相等操作符(==)为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的情况下,我们可以使用相等操作符(==),其他情况建议一律使用全等操作符(===)

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

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

相关文章

基于微信小程序的校园餐饮配送系统设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言学生微信小程序端的主要功能有:配送员微信小程序端的主要功能有:商家微信小程序端的主要功能有:管理员的主要功能有:具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序(小蔡coding&am…

单调栈和单调队列可以很简单

大家好,我是 方圆。我觉得单调栈和单调队列的题目很有特点,而且理解了它的特点能够很轻松容易地解决一系列题目,所以决定用这篇帖子记录一下,也想以此来帮助在刷同样类型题目的朋友们。如果大家想要找刷题路线的话,可以…

每日一题~组合总数III

原题链接:216. 组合总和 III - 力扣(LeetCode) 题目描述: 思路分析: 这是一个组合的问题,所以我们可以使用深度优先搜索(DFS)的方式将所有的情况都列举出来,然后将其中…

企业怎么申请OV SSL证书?

随着互联网的发展,越来越多的企业开始使用SSL证书来保护网站的安全。而OV SSL证书作为机构验证型的证书,能够重点强调网站安全、企业可信形象的网站,保密传输更加安全。那么,企业怎么申请OV SSL证书呢?接下来&#xff…

计算机视觉与深度学习-经典网络解析-GoogLeNet-[北邮鲁鹏]

这里写目录标题 GoogLeNet参考GoogLeNet模型结构创新点Inception结构,它能保留输入信号中的更多特征信息去掉了AlexNet的前两个全连接层,并采用了平均池化引入了辅助分类器 GoogLeNet GoogLeNet的设计主要特点是引入了Inception模块,这是一种…

聚观早报 | 杭州亚运开幕科技感拉满;腾讯官宣启动「青云计划」

【聚观365】9月25日消息 杭州亚运开幕科技感拉满 腾讯官宣启动「青云计划」 FF任命新全球CEO 比亚迪夺得多国销冠 iPhone 15/15 Pro销售低于预期 杭州亚运开幕科技感拉满 杭州第19届亚洲运动会开幕式23日晚在杭州奥体中心主体育馆举行,这届开幕式可谓科技感拉…

【linux进程(一)】深入理解进程概念--什么是进程?PCB的底层是什么?

💓博主CSDN主页:杭电码农-NEO💓   ⏩专栏分类:Linux从入门到精通⏪   🚚代码仓库:NEO的学习日记🚚   🌹关注我🫵带你学更多操作系统知识   🔝🔝 Linux进程 1. 前言2. PCB初认…

Java基本数据类型只有八种?第九种告诉你

一、前言 今天看了一下Oracle官网的JVM规范,发现基本数据不止有八种。 这个东西一直都是说着八种,官网把returnAddress放在八种基本数据类型一起说的,我们可以理解为第九种! 常说的八种用于存储常见的数值和字符数据&#xff0…

计算机等级考试—信息安全三级真题六

目录 一、单选题 二、填空题 三、综合题 一、单选题

阿里云ESS弹性伸缩核心概念与基本使用

文章目录 1.ESS弹性伸缩基本概念1.1.弹性伸缩概念1.2.弹性伸缩应用场景1.3.弹性伸缩的应用模式 2.开通ESS弹性伸缩服务3.为KodCloud云盘集群创建弹性伸缩组3.1.创建伸缩组3.2.设置伸缩组的名称、类型、移除策略、健康检查3.3.设置组内实例数、冷却时间、网络类型、扩缩容策略、…

python循环判断

运算符短路逻辑python优先级 思维导图for循环 运算符 运算符含义and左边和右边同时为True,结果为Trueor左右两边其中一个为True,结果为Truenot如果操作数为True(False),结果为False(True) 短路逻辑 从左到右,只有当第一操作数的值无法确定逻辑运算的结…

电脑开机慢怎么办?这样解决快速且有效!

“明明电脑用了才没多久,为什么开机那么慢呀?经常开个机需要好几分钟,这很耽误我的工作,请问有什么方法可以解决这个问题吗?” 电脑是现代生活不可或缺的工具,然而,当我们面对电脑开机缓慢的问题…

3D目标检测实战 | 图解KITTI数据集与数据格式

目录 1 数据集简介2 传感器坐标系3 数据集下载与组织4 数据内容说明4.1 矫正文件calib4.2 图像文件image4.3 点云文件velodyne4.4 标签文件label4.5 平面文件plane 1 数据集简介 KITTI数据集是一个广泛应用于自动驾驶和计算机视觉领域的公开数据集。该数据集由德国卡尔斯鲁厄理…

shell脚本自动化执行jar包

需要用shell脚本来自动化执行jar包,以后可以用jenkins来CI/CD,记录一下对应实现。 实现需求 以命令行执行shell传入的第一个参数为jar名进行执行。对应jar已存在执行进程,关闭对应进程后再执行。以后台方式执行对应的jar包,输出…

pymysql执行非查询语句会自动提交事务,关闭事务自动提交

一、前置条件 在mysql数据库生成数据: CREATE DATABASE mydatabase;CREATE TABLE Course (CourseID INT PRIMARY KEY,CourseName VARCHAR(100),Instructor VARCHAR(100),Credits INT,StudentID INT,FOREIGN KEY (StudentID) REFERENCES StudentInformation(Studen…

基于微信小程序四六级助手系统设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言用户微信小程序端的主要功能有:管理员的主要功能有:具体实现截图为什么选择我自己的网站自己的小程序(小蔡coding)有保障的售后福利 代码参考论文参考源码获取 前言 💗博主介绍:✌全网粉丝10W…

【C++prime plus中文第六版勘误记录】

P219-P220 这里对未进行初始化的指针pt进行了解引用的操作,这是不合理的,此问题在 stack overflow上也有人提出疑问,下面是问题与解答:

基于微信小程序的校园维修平台设计与实现(源码+lw+部署文档+讲解等

文章目录 前言学生微信小程序端的主要功能有:维修员微信小程序的主要功能有:管理员的主要功能有:具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序(小蔡coding)有保障的售后福利 代码参考源码获取…

Android 实现椭圆形中心发散渐变绘制

1. 前言 工作中有一个需求,需要实现一个椭圆形的中心发散渐变效果,并且可以自由指定椭圆比例,旋转角度等。 Android中实现椭圆形的绘制很简单,只需要调用canvas.drawOval()就可以了,圆形的中心发散渐变可以使用RadialGradient,但是椭圆形的中心发散渐变效果Android自带的…

Leetcode算法入门与数组丨6. 数组双指针、滑动窗口

文章目录 1 双指针基础知识1.1 双指针简介1.2 左右指针(对撞指针)1.3 快慢指针1.4 分离双指针 2 滑动窗口基础知识2.1 滑动窗口算法介绍2.2 滑动窗口适用范围2.3 固定长度滑动窗口2.4 不固定长度滑动窗口 1 双指针基础知识 1.1 双指针简介 双指针&…