The difference between a variable: null, undefined or undeclared

---

null 變數存在被賦予空、未知的值

undefined 變數存在但還沒有被賦值

undeclared 變數不存在

（同場加映）NaN 非數值的數值

---

• null:

  • 表示不存在任何對象值
  • 通常在可以預期對象但沒有相關對象的地方檢索。
  • 作為物件原型鏈的終點。
  • 布林值的判斷為 false
  ​​​​console.log(null==true) //false
  

  • 屬性為object(它不是全域對象的屬性標識符, 是用文字寫入的null)
  ​​​​console.log(typeof(null)) // 'object'
  

• undefined：

  • 變數被聲明了，但沒有賦值時，就等於undefined，如下圖：
    

  • 呼叫函式時，應該提供的引數沒有提供，該引數等於undefined，如下圖：
    

  • 物件沒有賦值的屬性，該屬性的值為undefined，如下圖：
    

  • 函式沒有返回值時，預設返回undefined。

  • 布林值判斷為false

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

  • 屬性為undefined(全域属性，屬性即為undefined)
  ​​​​console.log(typeof(undefined))  //undefined
  

• undeclared:

  • 指js的語法錯誤，會顯示ReferenceError，指沒有申明直接使用，導致js無法找到對應的上下文。
  • 變數在未宣告並使用的狀況下會得到 ReferenceError，並指出該變數並未宣告。
    • 在嚴格模式，該變數會undeclared
    ​​​​​​​​"use strict";
    ​​​​​​​​a = 10;
    ​​​​​​​​console.log(a); 
    ​​​​​​​​//Uncaught ReferenceError: a is not defined
    

    • 在非嚴格模式，視為有宣告，該變數會變成全域變數
    ​​​​​​​​a = 10;
    ​​​​​​​​console.log(a); 
    ​​​​​​​​// 變成全域變數
    

    ​​​​​​​​console.log(a); 
    ​​​​​​​​// 未宣告直接取值，Uncaught ReferenceError: a is not defined
    

• NaN (同場加映)

  • NaN 是 "Not a Number" 的簡稱，數學計算中，若無法產生數值時或程式無法表示值時，就會是NaN。
  • 布林值判斷為false
  ​​​​console.log(NaN==true) //false
  

  • 屬性為number(全域属性，表示非數值)
  ​​​​console.log(typeof(NaN)) //number
  

How would you go about checking for any of these states?

你如何檢查？

• undeclared
  如同上文所述，在執行程式時會直接報錯，顯示ReferenceError，導致程式中斷。

• undefined

  • 通常在取值或運算時才會報錯，因此容易在程式執行過程中被忽略。
  • 可以透過嚴格相等來檢視
  ​​​​var x;
  
  ​​​​if (x === undefined) {
  ​​​​    console.log("hi");//
  ​​​​}
  

  • 也可以透過typeof === undefined 來檢視
  ​​​​var x;
  ​​​​if(typeof x === 'undefined') {
  ​​​​    console.log("hello");
  ​​​​}
  

  • typeof == undefined 會判斷出null或undefined，所以要用嚴格式 *
  • 123 == '123' // true

• null

  • 通常在取值或運算時才會報錯，因此容易在程式執行過程中被忽略。
  • 可以透過typeof === object 與 布林值一同檢視
  ​​​​var a=null;
  ​​​​var b;
  ​​​​    
  ​​​​console.log(typeof a);    //object
  ​​​​console.log(typeof b);    //undefined
  ​​​​console.log(typeof c);    //undefined
  

• NaN

  • NaN 不等於（、!=、=、!==）任何值，包括 NaN 本身
  ​​​​NaN === NaN;        // false
  ​​​​Number.NaN === NaN; // false(Number.NaN就是NaN，但是在程式的執行判斷上，NaN不等於自身，會得到flase的答案)
  
  ​​​​0/0 //NaN
  ​​​​
  ​​​​NaN是用來判斷數字的工具
  

  (留意 undefined與null、NaN容易被混淆)

參考資料
MDN: null

MDN: undefined

MDN: NaN

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

Summer。桑莫。夏天: 你懂 JavaScript 嗎？#4 型別（Types）

Elaine's Blog: JavaScript null、undefined 與 undeclared

itread01: null，undefined，undeclared的區別Script