JS中鮮為人知的問題: [] == ![]結果為true,而 {} == !{}卻為false



console.log( [] == ![] )  // true
console.log( {} == !{} )  // false

在比較字符串、數值和布爾值的相等性時,問題還比較簡單。但在涉及到對象的比較時,問題就變得復雜了。最早的ECMAScript中的相等和不相等操作符會在執行比較之前,先將對象轉換成相似的類型。后來,有人提出了這種轉換到底是否合理的質疑。最后,ECMAScript的解決方案就是提供兩組操作符:

相等和不相等——先轉換再比較 (==)
全等和不全等——僅比較而不轉換 (===)

ECMAScript中相等操作符由兩個等於號(==)表示,如果兩個操作數相等,則返回true,這種操作符都會先轉換操作數(通常稱為強制轉型),然后再比較它們的相等性

在轉換不同的數據類型時,對於相等和不相等操作符:在JS高程中一書中給出如下的基本轉換規則

①、如果有一個操作數是布爾值,則在比較相等性之前先將其轉換為數值——false轉換為0,而true轉換為1;
②、如果一個操作數是字符串,另一個操作數是數值,在比較相等性之前先將字符串轉換為數值
③、如果一個操作數是對象,另一個操作數不是,則調用對象的valueOf()方法,用得到的基本類型值按照前面的規則進行比較

這兩個操作符在進行比較時則要遵循下列規則。
①、null 和undefined 是相等的
②、要比較相等性之前,不能將null 和 undefined 轉換成其他任何值
③、如果有一個操作數是NaN,則相等操作符返回 false ,而不相等操作符返回 true。重要提示:即使兩個操作數都是NaN,相等操作符也返回 false了;因為按照規則, NaN 不等於 NaN
④、如果兩個操作數都是對象,則比較它們是不是同一個對象,如果兩個操作數都指向同一個對象,則相等操作符返回 true;否則, 返回false

在這里插入圖片描述

這里說一下題外話:[] 和 {} 都是屬於引用類型,引用類型是存放在棧內存中的,而在堆內存中會有一個或者多個地址來指向這個棧內存相對應的數據。所以在使用 == 操作符的時候,對於引用類型的數據,比較的是地址,而不是真實的值。

現在來探討 [] == ! [] 的結果為什么會是true

①、根據運算符優先級 ,! 的優先級是大於 == 的,所以先會執行 ![]

!可將變量轉換成boolean類型,null、undefined、NaN以及空字符串('')取反都為true,其余都為false。

所以 ! [] 運算后的結果就是 false

也就是 [] == ! [] 相當於 [] == false

②、根據上面提到的規則(如果有一個操作數是布爾值,則在比較相等性之前先將其轉換為數值——false轉換為0,而true轉換為1),則需要把 false 轉成 0

也就是 [] == ! [] 相當於 [] == false 相當於 [] == 0

③、根據上面提到的規則(如果一個操作數是對象,另一個操作數不是,則調用對象的valueOf()方法,用得到的基本類型值按照前面的規則進行比較,如果對象沒有valueOf()方法,則調用 toString()

而對於空數組,[].toString() -> '' (返回的是空字符串)

也就是 [] == 0 相當於 '' == 0

④、根據上面提到的規則(如果一個操作數是字符串,另一個操作數是數值,在比較相等性之前先將字符串轉換為數值

Number('') -> 返回的是 0

相當於 0 == 0 自然就返回 true了

總結一下:

[] == ! [] -> [] == false -> [] == 0 -> '' == 0 -> 0 == 0 -> true

那么對於 {} == !{} 也是同理的

關鍵在於 {}.toString() -> NaN(返回的是NaN)

根據上面的規則(如果有一個操作數是NaN,則相等操作符返回 false

總結一下:

{} == ! {} -> {} == false -> {} == 0 -> NaN == 0 -> false

那么相信大家對下面的兩道題就信手拈來了


console.log( [] == !{} ) // true
console.log( {} == ![] ) // false

本文屬於magic_xiang原創,轉載需注明來源

來源:https://segmentfault.com/a/1190000017571299


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM