第JavaScript判斷兩個(gè)值相等的方法詳解目錄前言非嚴(yán)格相等嚴(yán)格相等同值零同值總結(jié)

前言

在JavaScript中如何判斷兩個(gè)值相等，這個(gè)問題看起來非常簡(jiǎn)單，但并非如此，在JavaScript中存在4種不同的相等邏輯，如果你不知道他們的區(qū)別，或者認(rèn)為判斷相等非常簡(jiǎn)單，那么本文非常適合你閱讀。

ECMAScript是JavaScript的語言規(guī)范，在ECMAScript規(guī)范中存在四種相等算法，如下圖所示：

上圖中四種算法對(duì)應(yīng)的中文名字如下，大部分前端應(yīng)該熟悉嚴(yán)格相等和非嚴(yán)格相等，但對(duì)于同值零和同值卻不熟悉，下面我們分別介紹這四種算法。

同值同值零非嚴(yán)格相等嚴(yán)格相等

非嚴(yán)格相等

非嚴(yán)格相等使用兩個(gè)等號(hào)，也就是我們熟悉的雙等，非嚴(yán)格相等表示語義相等，不要求類型一樣，非嚴(yán)格相等在比較前會(huì)先將比較參數(shù)類型轉(zhuǎn)換為一致，再進(jìn)行比較，代碼示例如下：

1==1;//true

1=='1';//true類型不同，不影響比較結(jié)果

非嚴(yán)格相等有非常復(fù)雜的轉(zhuǎn)換規(guī)則，非常難以記憶，社區(qū)中有人將上面的規(guī)則總結(jié)成了圖片，一圖勝千言，如下圖所示：

為了方便記住非嚴(yán)格相等的的轉(zhuǎn)換邏輯，作者將非對(duì)象值，可以總結(jié)為如下三條規(guī)則：

Undefined只和Null相等和Number比較時(shí)，另一個(gè)值會(huì)自動(dòng)轉(zhuǎn)換為Number和Boolean比較時(shí)，另一個(gè)值會(huì)轉(zhuǎn)換為Number

如果值為對(duì)象，會(huì)使用內(nèi)部的ToPrimitive轉(zhuǎn)換，可以通過自定義Symbol.toPrimitive改變返回值，需要注意的是在相等的判斷中Symbol.toPrimitive接受的hint參數(shù)都是default。

constobj={

[Symbol.toPrimitive](hint){

console.log(hint);

if(hint=='number'){

return1;

if(hint=='string'){

return'yan';

returntrue;

console.log(obj==1);//obj返回true

console.log(obj=='1');//obj返回true

console.log(obj==true);//obj返回true

非嚴(yán)格相等并非帶來了很多便利，通過隱式的自動(dòng)轉(zhuǎn)換，簡(jiǎn)化了部分場(chǎng)景的工作，比如Number和String的自動(dòng)轉(zhuǎn)換，簡(jiǎn)化了前端從表單，url參數(shù)中獲取值的比較問題，但自動(dòng)轉(zhuǎn)換帶來的問題比便利還多。

隱式轉(zhuǎn)換的規(guī)則，大部分情況下難以駕馭，現(xiàn)在主流的觀點(diǎn)已經(jīng)不建議使用，作者建議只在判斷undefined和null的場(chǎng)景下可以使用非嚴(yán)格相等。

嚴(yán)格相等

嚴(yán)格相等是另一種比較算法，其和非嚴(yán)格想等的區(qū)別是不會(huì)進(jìn)行類型轉(zhuǎn)換，類型不一致時(shí)直接返回false，嚴(yán)格相等對(duì)應(yīng)===操作符，因?yàn)槭褂萌齻€(gè)等號(hào)，也被稱作三等或者全等，嚴(yán)格相等示例如下：

1===1;//true

1==='1';//false類型不同，影響比較結(jié)果

不同類型值判斷規(guī)則如下，和前面的非嚴(yán)格相等對(duì)比，嚴(yán)格相等更符合直覺。

嚴(yán)格相等解決了非嚴(yán)格相等中隱式轉(zhuǎn)換帶來的問題，但也丟失了隱式轉(zhuǎn)換帶來的便利，對(duì)于類型可能不一致的情況下，比如從表單中獲取的值都是字符串，保險(xiǎn)的做法是，在比較前手動(dòng)類型轉(zhuǎn)換，代碼示例如下：

1===Number('1');//true手動(dòng)類型轉(zhuǎn)換，類型防御

嚴(yán)格相等幾乎總是正確的，但也有例外情況，比如NaN和正負(fù)0的問題。

Number類型有個(gè)特殊的值NaN，用來表示計(jì)算錯(cuò)誤的情概況，比較常見是非Number類型和Number類型計(jì)算時(shí)，會(huì)得到NaN值，代碼示例如下所示，這是從表單和接口請(qǐng)求獲取數(shù)據(jù)時(shí)很容易出現(xiàn)的問題。

consta=0/0;//NaN

constb='a'/1;

constc=undefined+1;//NaN

在嚴(yán)格相等中，NaN是不等于自己的，NaN是(x!==x)成立的唯一情況，在某些場(chǎng)景下其實(shí)是希望能夠判斷NaN的，可以使用isNaN進(jìn)行判斷，ECMAScript2015引入了新的Number.isNaN，和isNaN的區(qū)別是不會(huì)對(duì)傳入的參數(shù)做類型轉(zhuǎn)換，建議使用語義更清晰的Number.isNaN，但是要注意兼容性問題，判斷NaN代碼示例如下：

NaN===NaN;//false

isNaN(NaN);//true

Number.isNaN(NaN);//true

isNaN('aaa');//true自動(dòng)轉(zhuǎn)換類型'aaa'轉(zhuǎn)換為Number為NaN

Number.isNaN('aaa');//false不進(jìn)行轉(zhuǎn)換，類型不為Number，直接返回false

嚴(yán)格相等另一個(gè)例外情況是，無法區(qū)分+0和-0，代碼示例如下，在一些數(shù)學(xué)計(jì)算場(chǎng)景中是要區(qū)分語義的。

+0===-0;//true

JavaScript中很多系統(tǒng)函數(shù)都使用嚴(yán)格相等，比如數(shù)組的indexOf，lastIndexOf和switch-case等，需要注意，這些對(duì)于NaN無法返回正確結(jié)果，代碼示例如下：

[NaN].indexOf(NaN);//-1數(shù)組中其實(shí)存在NaN

[NaN].lastIndexOf(NaN);//-1

同值零

同值零是另一種相等算法，名字來源于規(guī)范的直譯，規(guī)范中叫做SameValueZero，同值零和嚴(yán)格相等功能一樣，除了處理NaN的方式，同值零認(rèn)為NaN和NaN相等，這在判斷NaN是否在集合中的語義下是非常合理的。

ECMAScript2016引入的includes使用此算法，此外Map的鍵去重和Set的值去重，使用此算法，代碼示例如下：

[NaN].incdudes(NaN);//true注意和indexOf的區(qū)別，incdudes的語義更合理

newSet([NaN,NaN]);//[NaN]set中只會(huì)有個(gè)一個(gè)NaN，如果NaN!==NaN的話，應(yīng)該是[NaN,NaN]

newMap([

[NaN,1],

[NaN,2],

]);//{NaN=2}如果NaN!==NaN的話，應(yīng)該是{NaN=1,NaN=