最近在看《JavaScript高階程式設計》一書，書中講到相等操作符(==)時說，要比較相等性之前，不能將 null 和 undefined 轉換成其他任何值，但要記住 null == undefined 會返回 true 。的確，在ECMAScript規範中也是這樣定義的，但我認為這樣來理解這件事情，似乎有些浮於表面，網上也有很多關於這個問題的文章，下面我希望從一個全新的角度來分析 null 和 undefined 的區別，從而理解兩者為何會相等：
Undefined 和 Null 是 Javascript 中兩種特殊的原始資料型別(Primary Type)，它們都只有一個值，分別對應 undefined 和 null ，這兩種不同型別的值，即有著不同的語義和場景，但又表現出較為相似的行為：
1、undefined
undefined 的字面意思就是未定義的值，這個值的語義是，希望表示一個變數最原始的狀態，而非人為操作的結果 。 這種原始狀態會在以下 4 種場景中出現：
【1】宣告瞭一個變數，但沒有賦值
|
1 2 |
var foo; console.log(foo); //undefined |
訪問foo，返回了undefined，表示這個變數自從宣告瞭以後，就從來沒有使用過，也沒有定義過任何有效的值，即處於一種原始而不可用的狀態。
【2】訪問物件上不存在的屬性
|
1 |
console.log(Object.foo); // undefined |
訪問Object物件上的 foo 屬性，同樣也返回 undefined ， 表示Object 上不存在或者沒有定義名為 “foo” 的屬性。
【3】函式定義了形參，但沒有傳遞實參
|
1 2 3 4 5 |
//函式定義了形參 a function fn(a) { console.log(a); //undefined } fn(); //未傳遞實參 |
函式 fn 定義了形參a， 但 fn 被呼叫時沒有傳遞引數，因此，fn 執行時的引數 a 就是一個原始的、未被賦值的變數。
【4】使用 void 對錶達式求值
|
1 2 3 4 5 |
void 0 ; // undefined void false; //undefined void []; //undefined void null; //undefined void function fn(){} ; //undefined |
ECMAScript 規範 void 操作符 對任何表示式求值都返回 undefined ，這個和函式執行操作後沒有返回值的作用是一樣的，JavaScript中的函式都有返回值，當沒有 return 操作時，就預設返回一個原始的狀態值，這個值就是undefined，表明函式的返回值未被定義。
因此，undefined 一般都來自於某個表示式最原始的狀態值，不是人為操作的結果。當然，你也可以手動給一個變數賦值 undefined，但這樣做沒有意義，因為一個變數不賦值就是 undefined 。
2、null
null 的字面意思是 空值 ，這個值的語義是，希望表示 一個物件被人為的重置為空物件，而非一個變數最原始的狀態 。 在記憶體裡的表示就是，棧中的變數沒有指向堆中的記憶體物件，即：
當一個物件被賦值了null 以後，原來的物件在記憶體中就處於遊離狀態，GC 會擇機回收該物件並釋放記憶體。因此，如果需要釋放某個物件，就將變數設定為null，即表示該物件已經被清空，目前無效狀態。試想一下，如果此處把 null 換成 undefined 會不會感到彆扭? 顯然語義不通，其操作不能正確的表達其想要的行為。
與 null 相關的另外一個問題需要解釋一下：
|
1 |
typeof null == 'object' |
null 有屬於自己的型別 Null，而不屬於Object型別，typeof 之所以會判定為 Object 型別，是因為JavaScript 資料型別在底層都是以二進位制的形式表示的，二進位制的前三位為 0 會被 typeof 判斷為物件型別，而 null 的二進位制位恰好都是 0 ，因此，null 被誤判斷為 Object 型別。
- 000 – 物件，資料是物件的應用
- 1 – 整型，資料是31位帶符號整數
- 010 – 雙精度型別，資料是雙精度數字
- 100 – 字串，資料是字串
- 110 – 布林型別，資料是布林值
其實，我們可以通過另一種方法獲取 null 的真實型別：
|
1 |
Object.prototype.toString.call(null) ; // [object Null] |
通過 Object 原型上的toString() 方法可以獲取到JavaScript 中物件的真實資料型別，當然 undefined 型別也可以通過這種方式來獲取：
|
1 |
Object.prototype.toString.call(undefined) ; // [object Undefined] |
3、相似性
雖然 undefined 和 null 的語義和場景不同，但總而言之，它們都表示的是一個無效的值。 因此，在JS中對這類值訪問屬性時，都會得到異常的結果：
ECMAScript 規範認為，既然 null 和 undefined 的行為很相似，並且都表示 一個無效的值，那麼它們所表示的內容也具有相似性，即有
|
1 |
undefined == null; //true |
不要試圖通過轉換資料型別來解釋這個結論，因為：
|
1 2 3 4 5 |
Number(null); // 0 Number(undefined); // NaN //在比較相等性之前，null 沒有被轉換為其他型別 null == 0 ; //false |
但 === 會返回 false ，因為全等操作 === 在比較相等性的時候，不會主動轉換分項的資料型別，而兩者又不屬於同一種型別：
|
1 2 |
undefined === null; //false，型別不相同 undefined !== null; //true, 型別不相同 |
4、總結
用一句話總結兩者的區別就是：undefined 表示一個變數自然的、最原始的狀態值，而 null 則表示一個變數被人為的設定為空物件，而不是原始狀態。所以，在實際使用過程中，為了保證變數所代表的語義，不要對一個變數顯式的賦值 undefined，當需要釋放一個物件時，直接賦值為 null 即可。
原創釋出 @一畫素 2017.08