小雕雕的家

前言 & 廢話：

這篇是基礎打底系列第二篇，這篇其實比較簡單些，要來搞懂的是 null、undefined、NaN 的差別

Javascript 這語言有很多特別的地方，除了上篇根據原始值、複合值來決定by value、by reference 外

其他語言只會有一種型態來表示 "沒有" 的意思，像 C# 是 null、VB.Net 是 Nothing

但 Javascript 至少就有 null 跟 undefined 兩種，另外還有個 NaN 不知道幹嘛的

這篇要來稍微了解一下它們之間的差異為何，還有開發時該怎麼處理這些特別的值

雖然簡短，但也有目錄，懶得看過程可以直接點結論：

1. 容易出包的狀況

2. Undefined

3. Null

4. NaN

5. 結論

容易出包的狀況：

首先，因為 null 跟 undefined 和 NaN 在 if 判斷時值都會轉換為 false，所以一般不容易遇到錯誤

但還是有些特殊的例子可能會因為這樣就包了，像下面這段網路上看到的例子

IE 必須要返回 undefined 才不會跳提示

或是你有一個非常良好的習慣，每次都是用 === 來做判斷，那也會非常容易出包

請看下面的例子

但你如果用這樣就會是 false

來看一下 null 跟 undefined 的型態，會發現一個是 object 一個是 undefined

還記得上一篇講的嗎?

當 Javascript 變數為複合值時，if 判斷式中比對的是記憶體位址

因為 null 被視為 object 也就是複合值，所以當然就不相等了

再來是 NaN，假設 a 是某個頁面上來的值，拿來 parseInt 之後再加 10 就 GG 了

以下來看看它們的差異

Undefined

來看看下面幾個 undefined 例子：

上面例子一開始用 var 宣告了 a 這個變數，但卻沒有指定值，javascript 是在給值時才決定型態的

所以直接輸出的時候就是 undefined 未定義型態

下一個例子：

呼叫函數時，缺少的參數是 undefined 

下一個例子：

要使用一個物件所沒有的屬性也是 undefined 

Null

在 js 裡反而比較少直接返回 null 的

以下的例子會返回 null

NaN

最後是 NaN 

NaN 是 "Not a Number" 的簡稱，常會發生在轉型的時候

ex : 

因為傳入了一個怎麼看都不像數字的字串進去，所以就會返回 NaN 

NaN 這東西很詭異，他跟任何數字相加都會是 NaN

但是跟字串相加就會變成真的字串相加

而且他的型態還是 number

NaN 可以使用 if 直接判斷，因為跟 null、undefined 一樣，在判斷式裡值轉為 false   

或是可以用內建的 isNaN() 函數判斷

結論：

綜合以上的例子可以大概知道：

null：這地方會有一個值，但這個值目前還沒準備好的意思，所以先填入 null

undefined：這地方沒有這個東西，所以你無法使用

NaN：要轉型成數字時傳入參數非數字的時候

而 null、undefined、NaN 在判斷上都可以直接當作 false 來判斷

因為在 if 判斷式裡會自動將 null、undefined、NaN 的值轉換為 false

但如果你要很確定的判斷 null 或 undefined，就請使用 ===

NaN 的話也可以使用內建的 isNaN() 函數來判斷

下篇待續....

Javascript 基礎打底系列 (一) - 常見的出包狀況解析 (關於By Value、By Reference)

Javascript 基礎打底系列 (二) - null、undefined、NaN 的差異與檢查方式

Javascript 基礎打底系列 - By Value、By Reference 的課後考題！

Javascript 基礎打底系列 (三) - 邏輯運算子，與短路邏輯 (short circuit logic) 的應用