你一定不知道的JavaScript等号运算符( `==和===` )

你不知道的JavaScript等号运算符( ==和=== )

JavaScript中共有2个个判断相等的运算符 == 和 ===。

这2个运算符的差别在于 == 在判断相等的时候会进行类型的转换，而 === 则不会进行类型转换。

一、=== 运算符

​ === 一般称之为严格相等。用来判断两个操作数是否严格相等。

​ 判断规则：

1. 首先判断两个操作数的类型是否一致，如果不一致就直接认为不等。
2. 如果两个操作数的类型一致，则再判断内容是否相等。

"true" === true  // 类型不一致，  false"0" === 0   //类型不一致  false"1" === "1"  //类型一致，并且内容也一致。 true

注意：

1. 如果使用 === 判断2个对象类型的数据，则直接判断这 2 个对象是否为同一个对象。
2. 如果一边是对象类型，一边是基本类型则一定不等。

{} === {}  //  两边都是对象，但是不是同一个对象，所以 false[] === []  // 两边都是对象，但是不是同一个对象，所以 false[] === ""  // 一变是对象类型，一边是基本类型，所以false

二、==运算符

​ ==运算符判断相等，由于涉及到类型的强制转换，所以最为复杂。

​ 需要从4个方面来进行分析：

1. 两边都是基本类型，且类型相同
2. 两边都是对象
3. 两边都是基本类型，但是类型不同
4. 一边是基本类型，一边是对象

2.1 两边都是基本类型，且类型相同

​ 这个最简单，就看内容是否相等即可。

2.2 两边都是对象

​ 这个也简单，规则和 === 一样，也是判断两个对象是否为同一个对象。

2.3 两边都是基本类型，但是类型不同

​ 这个规则比较复杂，很多人也记不住那么多的规则。

​ 经过我的分析和总结，其实这个规则只有一条：

两边基本类型不等时，会把两边的数据都转向number之后再进行比较

看下面的代码：

"" == 0  // true .   空字符串转换为数字 0"10" == 10 // true   字符串 "10" 转换为数字 10"1" == true  // true  字符串 "1" 转换为数字 1 ，布尔值true转换为数字 1"false" == false // false  字符串 "false"转换为NaN false转换为数字0undefined == "0"  // false  undefined 转换为 NaN2 == true  // false  "2" == true  // false2 == false // false

注意：有2个特殊情况，需要特别注意。

null == 0  // false  .  null并没有转换为0null == undefined // true

2.4 一边是基本类型，一边是对象

​ 这个规则也比较复杂，需要以2.3的规则为基础。

​ 经过我的分析和总结，其实规则只有 2 条：

这种情况比较的时候，都是先把对象转换成基本类型再去比较！

1. 先调用对象的valueOf方法，如果返回值值是基本类型的数据，就用这个返回的基本类型的数据去比较。
2. 如果valueOf方法的返回值不是基本类型的数据，则调用toString方法，然后使用toString的返回值进行比较。

注意：关于valueOf和toString方法的说明：

1. 这个两个方法是在Object.prototype对象中定义的，所以所有的对象都会继承这两个方法。
2. 默认情况下valueOf是返回的这个对象的本身(内部其实是返回的this)。
3. 默认情况下toString返回的是字符串: [object Object]
4. 但是有些内置对象 覆写 了这2个方法。

console.log([1, 2].toString());  //  "1,2"   返回的是数组的元素用,连接起来的字符串console.log(/a/gi.toString());   //   "/a/gi"  正则表达式的字面量字符串console.log((function(){//注释}).toString());  // "function(){//注释}"  返回函数源码console.log(new Number(10).toString());  // "10"  返回对应的基本类型的字面量形式console.log(({}).toString());   // "[object Object]"

看下面的代码：

var obj1 = {    name : "李四"}/* true： 解析： 一边是对象，一边是字符串。则会把对象转换成基本类型。 先看valueOf ，默认返回的是 对象，所以再看toString 默认返回的是 "[object Object]" 所以是true */console.log(obj1 == "[object Object]");   // true

var obj1 = {    name : "李四",    valueOf : function (){        return 1;    }}/* true： 解析： 一边是对象，一边是number。则会把对象转换成基本类型。 先看valueOf ，返回的是 number类型 1，所以用这个返回值去比较。 */console.log(obj1 == 1);  // true

var obj1 = {    name : "李四",    valueOf : function (){  //覆写        return {};    },    toString : function (){ // 覆写        return this.name;    }}/* true： 解析： 一边是对象，一边是String。则会把对象转换成基本类型。 先看valueOf ，返回的是 对象，所以调用toString，返回的是字符串 "李四"。 */console.log(obj1 == "李四");  // true

var arr = [1, 2];/* true： 解析： 一边是对象，一边是字符串。则会把对象转换成基本类型。 先看valueOf ，默认返回的是 对象，所以调用toString，返回的是字符串 "1,2"。 */console.log(arr == "1,2");  // true

var arr = [1, 2];arr.valueOf = function (){    return true;}/* true： 解析： 一边是对象，一边是字符串。则会把对象转换成基本类型。 先看valueOf ，默认返回的是 布尔值 true，然后把true转换成number  1， 右边是字符串，然后把字符串转换number 1 所以true */console.log(arr == "1");

三、总结

===一句话总结：先看类型，类型相同再比较内容。类型不同，直接false

==一句话总结：不同基本类型，则都向numbe方向转，然后比较。 一边对象一边基本类型，则对象先调用valueOf，再调用toString来转成基本类型，再比较。