摘要：無關(guān)緊要的開頭作為一個年輕的前端從業(yè)者，近期趾高氣昂的去各種面試，抱著找虐心態(tài)去單挑的結(jié)果就是被各種面試題晃斷腳踝并被射，然后開始質(zhì)問自己對的掌握為何如此淺薄，為何當(dāng)初不好好學(xué)世界上最好的語言。

/*===無關(guān)緊要的開頭start===*/
作為一個年輕的前端從業(yè)者，近期趾高氣昂的去各種面試，抱著找虐心態(tài)去單挑的結(jié)果就是被各種面試題晃斷腳踝并被yan射，然后開始質(zhì)問自己對js的掌握為何如此淺薄，為何當(dāng)初不好好學(xué)世界上最好的語言php。
當(dāng)然，這不僅提醒了我得背背面試題，還要時刻謹(jǐn)記，要寫安全規(guī)范的javascript代碼
然后小總結(jié)了一下那天面試上來的就被隔扣的第一題。
/*===無關(guān)緊要的開頭end===*/

null === undefined; // false
null == undefined; // true
null === 0; // false
null == 0; // false
false === 0; // false
false == 0; // true
true === 1; // false
true == 1; // true
true == "1"; // true
true == 2; // false
undefined === 0; // false
undefined == 0; // false

NaN === NaN; // false
NaN == NaN; // false
!NaN == !NaN; // false
!NaN; // true
null == NaN; // false
!null == !NaN; // true
!null === !NaN; // true
if(!NaN) console.log("媽呀，這都是啥啊"); // "媽呀，這都是啥啊"

false || 0; // 0
!(false || 0) // true
true && 1; // 1
true && 2; // 2
!(true && 2) // false
!(false || 2) // false

let a = 123;
let b = new Number(123);
a === b; // false
a == b; // true

let a = document.getElementsByTagName("a");
let b = document.getElementsByTagName("a");
a === b; //true

let c = document.querySelectorAll("a");
let d = document.querySelectorAll("a");
c === d; //false

/*待續(xù)。。。*/

答案在問題里邊，真是皮得很...

其實(shí)這些是我根據(jù)當(dāng)時的面試題整理和擴(kuò)充的，有些代碼中真的是碰不上，但是順手都寫上了。其實(shí)有些經(jīng)驗(yàn)的開發(fā)者都會知道這些，小的不才在這再說那么一小下。

還有一些ES6中的set和map和symbol等后期會寫到另一篇上。

這道題中涉及到強(qiáng)等、弱等、js中基礎(chǔ)類型轉(zhuǎn)換、懸疑NaN、null和undefined、選擇器等

js中的弱類型造福了人類，到處都是它貼心的幫你各種轉(zhuǎn)換，讓我們的代碼在瀏覽器上、在webview上、在node里、在各種模擬器里、在喜馬拉雅山上、在尼斯湖里、在握不緊的指尖上、在人生的光輝歲月里跑的流暢且難以預(yù)料。

所以：如何安全的寫js，其實(shí)真的很重要（忘了這是誰說的了）。

以下只是我的一些理解，歡迎指正?

雖然看了一個很棒的總結(jié)（https://www.cnblogs.com/nelso...）

但是自己的想法還是要講：

‘===’：
(1) 如果是基礎(chǔ)類型進(jìn)行比較，第一件事兒就是比較一下兩邊的數(shù)據(jù)類型，如果不一樣，直接false
(2) 如果兩個數(shù)據(jù)類型（這里指的還是基礎(chǔ)類型）一樣，那接下來就是直接的“值”的比較了
(3) 如果是引用類型的變量或者是內(nèi)置函數(shù)構(gòu)造出的變量進(jìn)行比較，那么就是指針的比較了
(4) null和undefined，再強(qiáng)等面前，只和自己相等。

‘==’：
(1) 如果是基礎(chǔ)類型進(jìn)行比較，類型一樣沒得說，類型不一樣，第一件事就是轉(zhuǎn)一下，字符串轉(zhuǎn)數(shù)字再進(jìn)行值的比較，boolean類型轉(zhuǎn)為數(shù)字

這里稍微總結(jié)了一下，可以頑固的認(rèn)為 == 都是再比較數(shù)字，所有的都轉(zhuǎn)換為數(shù)字，然后進(jìn)行“值”的比較了（不知道接下來這么理解是好還是壞）

舉個例子："123" == 123 // true
其實(shí)就是 new Number("123") == 123，兩邊值一樣，那就是true，不一樣就是false；

再舉個例子：
    true == 1; //true    
    true == "1" // true
    true == 2; // false
    false == 0 // true
    false == -1 // false
    
拿true == "1"來說
這樣就是 new Number(true) == new Number("1")
其實(shí)還是兩個為1的‘值’去比較
（new Number(true)返回一個 Number {1}，new Number(false)返回一個 Number {0}）

(2)如果是引用類型的變量或者是內(nèi)置函數(shù)構(gòu)造出的變量 和 基礎(chǔ)數(shù)據(jù)類型 去比較，那就是這些變量的值拿出來去比較，例如 "123asd" == new String("123ads") 返回true

(3)如果是引用類型的變量或者是內(nèi)置函數(shù)構(gòu)造出的變量 相互比較，那還是指針的比較

NaN，感覺其實(shí)就是一個為了避免非數(shù)字的數(shù)字操作引起程序報錯而設(shè)計的一個表示‘Not a Number’的存在，網(wǎng)上有好多好多介紹它的文字

因?yàn)橛懻摰膹?qiáng)等和弱等，那在這只說一點(diǎn)：NaN和誰都不等，不管什么等

所以
———— NaN === NaN 是false
———— NaN==NaN也是false
———— new Number(NaN) == new Number(NaN)也是 false

很難理解為什么是這樣，覺得是一個bug，其實(shí)我自己感覺這樣是對的，因?yàn)樗褪恰畣渭兊谋硎尽@不是一個數(shù)字，并沒有說是什么，such as：

NaN + 1; // NaN  那么一個數(shù)加一還是自己，那自己本來就不應(yīng)該等于自己。。。

let a = 12/0 //a是NaN
let b = 13/0 //b是NaN，但是很簡單看出a本來就不應(yīng)該等于b（雖然再高數(shù)上它們是相等的）
let raptors = 81/"Kobe" //raptors也是NaN，raptors本來就不該等于a或者b

所以任何和NaN去比較的話，那都是“不等”！

那么，該如何判斷是不是NaN呢
不賣關(guān)子了，我就是來說 isNaN 和 Number.isNaN

大家都知道isNaN======>

isNaN不是看上去那個意思，不是判斷“是一個NaN”，而是判斷“不是一個數(shù)字類型的值”，isNaN看上去就是幫你在內(nèi)部把傳入的值進(jìn)行了一次 new Number(param)的操作，然后new Number(param)返回NaN那就判斷為true，但是字符串等類型就沒有辦法判斷，如下：

isNaN(NaN); // 是個true
isNaN(NaN+1); // 當(dāng)然還是個true

isNaN(123); //當(dāng)然false
isNaN("123"); // 幫你轉(zhuǎn)了個類型，就是內(nèi)部執(zhí)行了一下isNaN(new Number("123")),所以還是false
isNaN("Curry"); //返回true，內(nèi)部執(zhí)行了一下(new Number("Curry")返回了NaN

第五行的字符串，竟然被判定為NaN，實(shí)際上它的確不是一個數(shù)字，但是它的的確確不是我們需要判斷的是一個NaN，所以這個方法只是用來判斷“不是一個數(shù)字類型的值”

然后大家還知道Number.isNaN======>

es6來補(bǔ)漏了，Number.isNaN的出現(xiàn)解決了大家希望判斷“是一個NaN”的操作。如下

Number.isNaN("Curry"); //返回false

NaN結(jié)束了

在問題中有這樣一個東西：

let a = document.getElementsByTagName("a");
let b = document.getElementsByTagName("a");
a === b; // true

let c = document.querySelectorAll("a");
let d = document.querySelectorAll("a");
c === d; //false

這衍生出來的：getElementsByTagName查出來是什么？querySelectorAll查出來的又是什么？

MDN上告訴我們：

———— getElementsByTagName查出來的是HTMLCollection，HTMLCollection是一個動態(tài)的dom節(jié)點(diǎn)集合，綁定在document的live上，隨著document變化隨時更新，指向每一個符合選擇要求的dom節(jié)點(diǎn)，這既是為什么上邊例子中 a===b 為 true 的原因了

———— querySelectorAll查出來的是NodeList，是一個單純的選擇器選出的dom節(jié)點(diǎn)集合，這就是為什么上邊例子中 c===d 為 false 了

HTMLCollection和NodeList都是只讀的。jQuery也是使用的querySelectorAll，所以jQuery選擇器選擇出來也是對NodeList進(jìn)行操作，所以:

var a = $("a");
var b = $("a");
a === b; // false

所以，事件委托真?zhèn)ゴ?..

其實(shí)由NaN、選擇器、===和==、基本數(shù)據(jù)類型轉(zhuǎn)換、內(nèi)置函數(shù)構(gòu)造出的對象結(jié)合進(jìn)數(shù)組中，去判斷數(shù)組值相等，去去重、去求交并補(bǔ)等操作，并結(jié)合set和map，都有很多討論的話題，希望下次能分享給大家

感謝各位的閱讀，這些只是我自己的一些理解和想法，希望不正確的地方各位能夠幫忙指正。