chst365's blog chst365's blog
首页
  • Git
  • 网络
  • 操作系统
  • 浏览器
  • webpack
  • JavaScript
  • TypeScript
  • 性能
  • 工程化
  • React
  • 编程题
  • React技术揭秘
  • 算法
  • Node
  • 编码解码
  • NodeJS系列
  • Linux系列
  • JavaScript系列
  • HTTP系列
  • GIT系列
  • ES6系列
  • 设计模式系列
  • CSS系列
  • 小程序系列
  • 数据结构与算法系列
  • React系列
  • Vue3系列
  • Vue系列
  • TypeScript系列
  • Webpack系列
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

chst365

DIV工程师
首页
  • Git
  • 网络
  • 操作系统
  • 浏览器
  • webpack
  • JavaScript
  • TypeScript
  • 性能
  • 工程化
  • React
  • 编程题
  • React技术揭秘
  • 算法
  • Node
  • 编码解码
  • NodeJS系列
  • Linux系列
  • JavaScript系列
  • HTTP系列
  • GIT系列
  • ES6系列
  • 设计模式系列
  • CSS系列
  • 小程序系列
  • 数据结构与算法系列
  • React系列
  • Vue3系列
  • Vue系列
  • TypeScript系列
  • Webpack系列
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • NodeJS系列

  • Linux系列

  • JavaScript系列

    • 举例说明你对尾递归的理解,有哪些应用场景
    • bind、call、apply 区别?如何实现一个bind?
    • 说说你对函数式编程的理解?优缺点?
    • 说说你对BOM的理解,常见的BOM对象你了解哪些?
    • 说说new操作符具体干了什么?
    • 说说 Javascript 数字精度丢失的问题,如何解决?
    • 说说你对事件循环的理解
    • 什么是防抖和节流?有什么区别?如何实现?
    • 说说你对正则表达式的理解?应用场景?
    • 谈谈 JavaScript 中的类型转换机制
    • 说说你对作用域链的理解
    • DOM常见的操作有哪些?
    • 说说你对闭包的理解?闭包使用场景
    • JavaScript原型,原型链 ? 有什么特点?
    • ajax原理是什么?如何实现?
    • Javascript如何实现继承?
    • 大文件上传如何做断点续传?
    • 说说你了解的js数据结构?
    • 解释下什么是事件代理?应用场景?
    • == 和 ===区别,分别在什么情况使用
      • 一、等于操作符
      • 二、全等操作符
      • 三、区别
        • 小结
    • 说说JavaScript中的事件模型
    • JavaScript字符串的常用方法有哪些?
    • 数组的常用方法有哪些?
    • 如何判断一个元素是否在可视区域中?
    • 深拷贝浅拷贝的区别?如何实现一个深拷贝?
    • typeof 与 instanceof 区别
    • Javascript本地存储的方式有哪些?区别及应用场景?
    • 说说JavaScript中的数据类型?存储上的差别?
    • 说说 JavaScript 中内存泄漏的几种情况?
    • 什么是单点登录?如何实现?
    • JavaScript中执行上下文和执行栈是什么?
    • 如何实现上拉加载,下拉刷新?
    • Javascript中如何实现函数缓存?函数缓存有哪些应用场景?
    • web常见的攻击方式有哪些?如何防御?
    • 谈谈this对象的理解
  • HTTP系列

  • GIT系列

  • ES6系列

  • 设计模式系列

  • CSS系列

  • 小程序系列

  • 数据结构与算法系列

  • React系列

  • Vue3系列

  • Vue系列

  • TypeScript系列

  • Webpack系列

  • 面试官
  • JavaScript系列
chst365
2023-06-28
目录

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

# 面试官:== 和 ===区别,分别在什么情况使用

# 一、等于操作符

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

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

遵循以下规则:

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

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

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

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

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

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

null和undefined相等

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

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

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

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

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

下面进一步做个小结:

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

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

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

  • null 和 undefined 相等

  • 存在 NaN 则返回 false

# 二、全等操作符

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

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

undefined 和 null 与自身严格相等

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

# 三、区别

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

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

null 和 undefined 比较,相等操作符(==)为true,全等为false

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

# 小结

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

'' == '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
1
2
3
4
5
6
7
8
9
10
11
12

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

const obj = {};

if(obj.x == null){
  console.log("1");  //执行
}
1
2
3
4
5

等同于下面写法

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

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

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

#面试官
上次更新: 2025/04/11, 17:57:53
解释下什么是事件代理?应用场景?
说说JavaScript中的事件模型

← 解释下什么是事件代理?应用场景? 说说JavaScript中的事件模型→

最近更新
01
面试官
03-27
02
this&指针&作用域&闭包
03-27
03
前端
03-27
更多文章>
Theme by Vdoing | Copyright © 2019-2025 chst365 | 豫ICP备17031889号-1
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式