undefined 與 null 的差異

tags: JavaScript 直播班

何時出現 undefined？

  • 變數已被宣告，但沒有給予值（未被定義）
  • 使用 var 宣告時出現的 hoisting 狀況

變數已被宣告，但沒有給予值（未被定義）

let a;
console.log(a); // output: undefined

使用 var 宣告時出現的 hoisting 狀況

JavaScript 編譯時會先將所有變數掃過一輪，先畫出記憶體空間後再賦予值到變數。因此使用 var 宣告變數，會出現在宣告變數前就嘗試取值，但因為還沒賦予值，而出現 undefined 訊息。

另外，因為有先畫出空間，代表 JavaScript 知道有這個變數，只是還沒到宣告那一行，因此不會出現沒有定義變數訊息 a is not defined 。

console.log(a); // output: undefined
var a = 1;
console.log(a); // output: 1

但如果利用 let 宣告變數，錯誤訊息會換成 Uncaught ReferenceError: Cannot access 'a' before initialization。

何時出現 null？

  • 宣告變數時，賦予值為空值。
  • 原本變數有值想清空，賦予值為空值。
let a = null; // 宣告變數時賦予值為空值
let b = 1;
b = null; // 將原本變數值清空

undefined 與 null 型別

兩者型別如名。如下：

let a;
let b = null;
console.log(a, b); // output: undefined null

參考資料

Select a repo