前端碎碎念 之 爲何[] == ![] ?

『前端碎碎念』系列會記錄我平時看書或者看文章遇到的問題，通常都是比較基礎可是容易遺忘的知識點，你也可能會在面試中碰到。 我會查閱一些資料並可能加上本身的理解，來記錄這些問題。更多文章請前往個人我的博客

相似標題中的問題還有不少，例如：

爲何 [ ] == false 而 !![ ] == true ？

or

[1] == [1] 是true 仍是 false？

若是對 == 操做符只知其一;不知其二，就很難解答相似的問題。咱們直接開門見山，看看==是如何工做的，這裏的難點主要涉及到js中的隱式強制類型轉換。

判斷步驟以下：

1. 若是有一個操做數是布爾值，則在比較相等性以前先將其轉換爲數值----false轉換爲0，而true轉換爲1。

2. 若是一個操做數是字符串，另外一個操做數是數值，在比較相等性以前先將字符串轉換爲數值。

3. 若是一個操做數是對象，另外一個操做數不是，則調用對象的valueOf()方法，若是獲得的值不是基本類型值，則基於返回值再調用toString方法（這個過程即ToPrimitive），用獲得的基本類型值按照前面的規則進行比較。

4. 若是兩個操做數都是對象，則比較他們是否是同一個對象。若是兩個操做數指向同一個對象，則相等操做符返回true, 不然返回false。

這兩個操做符在進行比較時則要遵循下列規則。

1. null 和 undefined 是相等的。

2. 要比較相等性以前，不能將null和undefined轉換成其餘任何值

3. 若是有一個操做數是NaN，則相等操做符返回false, 而不相等操做符則返回true, NaN != NaN

我畫了一個圖來表示這個過程：

根據上面的步驟，來分析[] == ![] 爲何會返回true

[] == ![]

!運算符的優先級大於 ==，因此實際上這裏還涉及到!的運算。
這個比較簡單！會將後面的值轉化爲布爾值。即![]變成!Boolean([]), 也就是!true,也就是false。

其實是對比 [] == false;

運用上面的順序，false是布爾值，因此轉化爲數值Number(flase), 爲0。

對比[] == 0;

知足第三條規則[] 是對象（數組也屬於對象），0不是對象。因此ToPrimitive([])是""

對比"" == 0;

知足第二條規則，"" 是字符串，0是數值，對比Number("") == 0, 也就是 0 == 0。

因此得出 [] == ![]

咱們能夠用一樣的方法對上面提到的兩個等式例子進行判斷，都能得出結論。雖然過程有點麻煩，可是本質上就是將兩邊的比較值轉化爲數值進行比較。讀者能夠自行嘗試實踐。