面试经典题:Object.is 和 == 以及 === 的区别

前言

在 JavaScript 中,比较操作符是编写代码时经常使用的基本功能之一。本文将详细介绍 Object.is===== 之间的区别。

1. Object.is

Object.isECMAScript 6 中引入的一种比较方法,它旨在提供一种更严格的比较方式,以解决 JavaScript 中一些奇怪的类型比较行为。

  • Object.is 通过检查两个值是否相等来进行比较。

  • 它遵循与 === 相同的行为,但有两个不同之处:

如以下例子

js 复制代码
Object.is(NaN, NaN); // true
NaN === NaN;         // false

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

2. ==

== 是 JavaScript 中的相等比较操作符之一,它用于比较两个值是否相等。但是,它在进行比较时会进行类型转换。

  • 如果两个操作数具有相同的类型,则执行严格相等比较 (===)。
  • 如果操作数具有不同的类型,则尝试将它们转换为相同的类型,然后进行比较。
js 复制代码
0 == '';         // true,因为 '' 被转换为 0
1 == true;       // true,因为 true 被转换为 1

转换规则

  1. 首先判断两者的类型是否相同,如果相同,则会比较值的不同
  2. 如果两者类型不同,则会做类型转换,首先比较是否是null和undefined,如果是,则返回true
js 复制代码
null == undefind // true
null == null // true
undefind == undefind // true
  1. 如果不是则会判断两者是否为字符串或者数字,如果是则将字符串转换为数字
js 复制代码
1 == '1'(后面的1会转换为数字1)
Number('') => 0 
  1. 如果不是字符串或者数字,则会判断是否为boolean,如果是boolean,则将boolean转换为数字判断
js 复制代码
true == '1' // true
步骤详解
1、Number(true) ==> 1, 此时比较式变为 1 == '1',符合第三条规则,将字符串变为数字
2、Number('1') ===> 1, 此时比较式变为 1 == 1
  1. 如果是Object,则会将Object转换为基本类型,去进行比较
js 复制代码
[] === 0
1. 首先调用数组的valueOf方法
[].valueOf() ==> []
2. 调用数组的toString()
[].toString() ==> ""
3. 此时等式变为 "" == 0,符合第三条
4. Number("") ==> 0, 此时等式变为0==0

3. ===

=== 是 JavaScript 中的严格相等比较操作符,它不会进行类型转换。

  • 只有在两个操作数具有相同的类型且值相等时,=== 才返回 true
  • 否则,它返回 false
js 复制代码
0 === '';       // false,因为类型不同
1 === true;     // false,因为类型不同

总结

  • Object.is 提供了一种更严格的相等比较方法,解决了 === 无法正确处理 NaN-0/+0 的问题。
  • == 进行比较时会进行类型转换,可能会导致一些意想不到的结果。
  • === 是一种更可靠的比较方式,不会进行类型转换。
相关推荐
别惊醒渔人1 小时前
Vue3 Diff 优化:最长递增子序列 LIS
前端·javascript·vue.js
颜酱1 小时前
07 | 把字段与指标同步到 Qdrant(生成阶段)
前端·人工智能·后端
用户059540174461 小时前
把AI长期记忆测试从手动验证换成pytest,2天揪出11个隐藏Bug
前端·css
lichenyang4532 小时前
从 Vite 空项目到 AIGC 图片工作台:我如何打通生图、任务轮询、生成库与 Canvas 动态特效
前端·人工智能
泡沫冰@3 小时前
上章节中文件的讲解
前端·网络·nginx
进击的丸子3 小时前
APP人脸识别增值版Harmony Demo实操与关键代码解析
前端·程序员·harmonyos
a1117763 小时前
唯美花朵风格的黑胶唱片音乐播放器
前端·css·css3
Hilaku3 小时前
工作 5 年后,决定你薪资上限的究竟是什么?
前端·javascript·程序员
爱分享的程序猿-Clark3 小时前
【前端分享】vue3 有 keep-alive属性吗?
前端
Revolution614 小时前
页面更新后为什么出现 Loading chunk failed:旧页面如何请求了已删除的构建产物
前端·面试·前端工程化