前言：

雙等號與三等號區(qū)別，是近年面試的高頻考點(diǎn)，但相信不少前端老兵都只知道大概的區(qū)別。別慌，希望看完本文章能讓你掌握這個(gè)知識點(diǎn)。

一.等于操作符（==）

當(dāng)使用雙等號（==）進(jìn)行比較時(shí)，JS首先會(huì)判斷兩個(gè)值類型是否相同。如果兩個(gè)值類型相同，則直接進(jìn)行比較；如果兩個(gè)值類型不同，會(huì)先將比較的兩個(gè)值轉(zhuǎn)換為相同的類型，然后再進(jìn)行比較（一般情況，下面會(huì)講特殊情況）。

在類型轉(zhuǎn)換過程中，JS遵循以下規(guī)則：

1.如果比較的兩個(gè)值類型相同，則直接返回比較結(jié)果。 

console.log(1 == 1) //true

2.如果比較的兩個(gè)值類型不同，則先將比較的兩個(gè)值轉(zhuǎn)換為相同的類型，然后再進(jìn)行比較（一般情況，下面會(huì)講特殊情況）。    

（1）如果一個(gè)值是數(shù)字，另一個(gè)值是字符串，JS會(huì)嘗試將字符串轉(zhuǎn)換為數(shù)字，然后再進(jìn)行比較。

console.log(1 == "1") //true

（2）Boolean 和其他任何類型比較，Boolean 首先被轉(zhuǎn)換為 Number 類型。

console.log(true == 1) //true
console.log(true == "1") //true

（3）兩個(gè)值都是引用類型且類型相同，它們指向的是同一個(gè)內(nèi)存地址的話，返回true。

console.log({} == {}) //false 雖然類型相同，但引用地址不同

const obj = {}
console.log(obj == obj) //true 引用地址相同

（4）如果一個(gè)值是引用類型，另一個(gè)值是原始類型，JS會(huì)嘗試使用valueOf()或toString()方法將引用類型轉(zhuǎn)換為原始類型的值，然后再進(jìn)行比較。 

console.log("[object Object]" == {}) // true, 對象和字符串比較，沒有自定義valueOf方法，對象通過 toString 得到一個(gè)基本類型值

const obj = {
  valueOf: function () {
    return 1
  },
}
console.log(obj == 1) // true 對象和字符串比較，有自定義valueOf方法,調(diào)用valueOf方法

console.log("1,2,3" == [1, 2, 3]) // true, 數(shù)組和字符串比較，沒有自定義valueOf方法 數(shù)組通過 toString 得到一個(gè)基本類型值

3.在特殊情況下，如果比較的兩個(gè)值的類型不同，不會(huì)進(jìn)行類型轉(zhuǎn)換，直接進(jìn)行比較。

（1）null == undefined比較結(jié)果是true。null、undefined和其他任何結(jié)果的比較值都為false，但是null和null，undefined和undefined為true。

console.log(null == undefined) //true

console.log(null == null) //true
console.log(null == "") //false
console.log(null == 0) //false
console.log(null == false) //false

console.log(undefined== undefined) //true
console.log(undefined == "") //false
console.log(undefined == 0) //false
console.log(undefined == false) //false

（2）NaN和其他任何類型比較是false（包括和它自己） 

console.log(NaN == NaN) //false
console.log(NaN == undefined) //false

二.全等操作符（===）

1.如果比較的兩個(gè)值類型不同，直接返回false。

console.log(1 === "1") //false

2.如果比較的兩個(gè)值是數(shù)字，并且它們具有相同的值，返回true。

3.如果比較的兩個(gè)值是字符串，并且它們具有相同的值，返回true。

4.如果比較的兩個(gè)值是布爾值，并且它們具有相同的真值或假值，返回true。

5.如果比較的兩個(gè)值是引用類型，它們指向的是同一個(gè)內(nèi)存地址，返回true。

console.log({} === {}) //false 雖然類型，內(nèi)容相同，但引用地址不同

const obj = {}
console.log(obj === obj) //true 引用地址相同

6.如果比較的兩個(gè)值都是null或都是undefined，它們被視為相等的，返回true。

console.log(null === undefined) //false

console.log(null === null) //true
console.log(null === "") //false
console.log(null === 0) //false
console.log(null === false) //false

console.log(undefined=== undefined) //true
console.log(undefined === "") //false
console.log(undefined === 0) //false
console.log(undefined === false) //false

7.NaN和其他任何類型比較是false（包括和它自己）

console.log(NaN === NaN) //false
console.log(NaN === undefined) //false
console.log(NaN === 0) //false
console.log(NaN === null) //false
console.log(NaN === "") //false

三.區(qū)別：

1.雙等號比較可能會(huì)進(jìn)行類型轉(zhuǎn)換，是寬松比較；而三等號不會(huì)進(jìn)行類型轉(zhuǎn)換，是嚴(yán)格比較

2.null和undefined的比較不同

雙等號下null和undefined比較返回為true；而三等號下null和undefined比較返回為false

console.log(null == undefined) //true
console.log(null === undefined) //false

在實(shí)際開發(fā)中更推薦用三等號進(jìn)行比較，能提高安全性，因?yàn)殡p等號比較可能會(huì)進(jìn)行類型轉(zhuǎn)換，可能會(huì)帶來意外的結(jié)果。當(dāng)然你能正確使用雙等號的話，使用雙等號也無所謂，能提高代碼簡潔性。（但是據(jù)我所知，蠻多喜歡用雙等號的前端開發(fā)者多多少少容易出bug，小編之前幫一位同事改bug，發(fā)現(xiàn)幾個(gè)bug都是由雙等號引起的）

總結(jié)

到此這篇關(guān)于JavaScript雙等號(==)與三等號(===)區(qū)別的文章就介紹到這了,更多相關(guān)js雙等號和三等號區(qū)別內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論