JavaScript 彻底读懂和使用 == 和 ===

首先我们要知道 ===== 到底都是什么概念,区别是什么,才可以在不用的场景中使用这两个运算符。

=== 叫做严格运算符, == 叫做相等运算符。

严格运算符的运算规则如下:

  1. 如果两个值的类型不同,直接返回 false
  2. 同一类型的原始类型的值(数值、字符串、布尔值)比较时,值相同就返回 true,值不同就返回 false
  3. 两个复合了类型(对象、数组、函数)的数据比较时,不是比较它们的值是否相等,而是比较它们是否指向同一个对象。
  4. undefinednull 与自身严格相等。

下面举几个例子:

'111' === 111 // false
111 === 111 // true
111 === 222 // false
{a:'1'} === {a:'1'} // false
var a = {value:'1'};
var b = {value:'1'};
a === b; // false
a === a; // true
var c = a;
c === a; // true
null === null // true
undefined === undefined // true

相等运算符在比较相同类型的数据时,与严格相等运算符完全一样。

在比较不同类型的数据时,相等运算符会先将数据进行类型转换,然后再用严格相等运算符比较。

类型转换规则如下:

  1. 原始类型的数据会转换成数值类型再进行比较。字符串和布尔值都会转换成数值。
  2. 对象(这里指广义的对象,包括数值和函数)与原始类型值比较时,对象转化成原始类型的值,再进行比较。
  3. undefinednull 与其他类型的值比较时,结果都为 false,它们相互比较时结果为 true

通过上面类型转换规则的介绍我们可以看出,相等运算符隐藏的类型转换,会带来一个违反直觉的结果。

下面举几个例子:

'' == '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

甚至还会改变比较的数据的值!请看代码:

var x = 1;
var obj = {
  valueOf: function() {
    x = 2;
    return 0;
  }
}
console.log(obj == 0, x); // true, 2
// 根据类型转换规则的第二点可知对象与原始类型的值比较时,对象会转化成原始类型的值,再进行比较。在对象转化成原始类型的过程中会调用 obj.valueOf 这个方法所以全局变量 x 会赋值为 2

或者产生异常

var x = 1;
var obj = {
  valueOf: function() {
    return {}
  },
  toString: function() {
    return {}
  }
}
console.log(obj == 0); // Error: Cannot convert object to primitive value
// 中文解释为 "不能将对象转换为原始值",详见 http://blog.csdn.net/wopelo/article/details/61913796

由此可见,使用 == 在很多情况下是不安全的,并且可能会造成一些错误。这就是为什么建议尽量不要使用相等运算符的原因。

那到底什么时候可以使用 == 相等运算符呢?

答案:是只有在检测 null/undefined 的时候可以使用 x == null,因为我们通常不区分 nullundefined ,即将 x == null 作为 x === null || x === undefined 的缩写。其他时候会建议使用严格运算符。

如果非要问还有没有其他情况可以使用 == 相等运算符,这里有一篇文章进行了详细的介绍,可以参考:
在JavaScript中什么时候使用==是正确的?

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,386评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,142评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,704评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,702评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,716评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,573评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,314评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,230评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,680评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,873评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,991评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,706评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,329评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,910评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,038评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,158评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,941评论 2 355

推荐阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 4,149评论 0 13
  • 标签: 我的笔记 ---学习资料:http://javascript.ruanyifeng.com/ 1. 导论 ...
    暗夜的怒吼阅读 812评论 0 1
  • 运算符是处理数据的基本方法,用来从现有的值得到新的值。JavaScript 提供了多种运算符,本章逐一介绍这些运算...
    许先生__阅读 605评论 0 3
  • 吃一只芒果,果核占了一半。 于是写: 天气被秋雨赶着奔向了冬天,又想起一件趣事,于是写: 当时的心情是很绝望的。笑...
    苏白杞阅读 269评论 15 12
  • 天眼即人上丹田处,最形象的表现就是二郎神的第三只眼,开天眼就是通过修行打开这个第三只眼。在中国长大的人,一定都听说...
    linhuizhang阅读 952评论 0 0