深化探求：null 和 undefined 畢竟有何區別？

簡便區分

總的來說 null 和 undefined 都代表空，主要區別在于 undefined 表現尚未初始化的變量的值，而 null 表現該變量故意短少目標指向。

• undefined
• 這個變量從基本上就沒有界說
• 隱蔽式 空值
• null
• 這個值固然界說了，但它并未指向任何內存中的目標
• 聲明式 空值

MDN 中給出的界說

null

值 null 是一個字面量，不像 undefined ，它不是全局目標的一個屬性。null 是表現短少的標識，指示變量未指向任何目標。把 null 作為尚未創建的目標，約莫更好了解。在 API 中，null 常在前往典范應是一個目標，但沒有關聯的值的場合使用。

undefined

undefined 是 全局目標 的一個屬性。也就是說，它是全局作用域的一個變量。undefined 的最初值就是原始數據典范 undefined 。

一張神奇的圖片

接下去我們看一張比力經典的圖片，該圖來自 stackoverflow 的回復，本人沒有找到準確的出處。

體現情勢

在更深化了解 null 和 undefined 的區別前，我們起主要曉得 null 和 undefined 在 JS 中有什么不同的體現情勢，用以便利我們更好的了解 null 和 undefined 的區別。

typeof

typeof null // 'object' typeof undefined // 'undefined'

Object.prototype.toString.call

typeof null // '[object Null]' typeof undefined // '[object Undefined]'

== 與 ===

null == undefined // true null === undefined // false !!null === !!undefined // true

Object.getPrototypeOf(Object.prototype)

JavaScript 中第一個目標的原型指向 null 。

Object.getPrototypeOf(Object.prototype) // null

+ 運算 與 Number()

let a = undefined + 1 // NaN let b = null + 1 // 1 Number(undefined) // NaN Number(null) // 0

JSON

JSON.stringify({a: undefined}) // '{}' JSON.stringify({b: null}) // '{b: null}' JSON.stringify({a: undefined, b: null}) // '{b: null}'

let undefiend = 'test'

function test(n) { let undefined = 'test' return n === undefined } test() // false test(undefined) // false test('test') // ture let undefined = 'test' // Uncaught SyntaxError: Identifier 'undefined' has already been declared

深化探究

為什么 typeof null 是 object？

typeof null 輸入為 'object' 但是是一個底層的錯誤，但直到現階段都無法被修復。

緣故是，在 JavaScript 初始版本中，值以 32位 存儲。前 3位 表現數據典范的標志，其他位則是值。

關于一切的目標，它的前 3位 都以 000 作為典范標志位。在 JavaScript 早前版本中， null 被以為是一個特別的值，用來對應 C 中的 空指針 。但 JavaScript 中沒有 C 中的指針，以是 null 意味著什么都沒有大概 void 并以 全0(32個) 表現。

因此每當 JavaScript 讀取 null 時，它前端的 3位 將它視為 目標典范 ，這也是為什么 typeof null 前往 'object' 的緣故。

為什么 Object.prototype.toString.call(null) 輸入 '[object Null]'

toString() 是 Object 的原型辦法，調用該辦法，默許前往如今目標的 [[Class]] 。這是一個內里屬性，其格式為 [object Xxx] ，此中 Xxx 就是目標的典范。

JavaScript 萬物皆目標，為什么 xxx.toString() 不克不及前往變量典范？

這是由于 各個類中重寫了 toString 的辦法，因此必要調用 Object 中的 toString 辦法，必需使用 toString.call() 的辦法調用。

關于 Object 目標，直接調用 toString() 就能前往 '[object Object]' 。而關于其他目標，則必要經過 call / apply 來調用才干前往準確的典范信息。

為什么 == 和 === 比力會顯現 true 和 false ？

很多文章說：undefined 的布爾值是 false ， null 的布爾值也是 false ，以是它們在比力時都轉化為了 false ，以是 undefined == null 。
實踐上并不是如此的。

ECMA 在 11.9.3 章節中明白報告我們：

If x is null and y is undefined, return true.

If x is undefined and y is null, return true.

這是 JavaScript 底層的內容了，至于更深化的內容，假如有興致可以扒一扒 JavaScript 的源碼。

為什么null + 1和undefined + 1體現不同？

這觸及到 JavaScript 中的隱式典范轉換，在實行 加法運算 前，隱士典范轉換會實驗將表達式中的變量轉換為 number 典范。如：'1' + 1 會取得后果 11。

• null 轉化為 number 時，會轉換成 0
• undefined 轉換為 number 時，會轉換為 NaN

至于為什么實行云云的轉換辦法，我推測是 JavaScript 早前的一個糟糕計劃。

從言語學的角度來看：
null 意味著一個明白的沒有指向的空值，而 undefined 則意味著一個未知的值。
在某種水平上， 0 意味著數字空值。
這固然看起來有些牽強，但是我在這一階段能所最能想到的約莫了。

為什么 JSON.stringify 會將值為 undefined 的內容刪除？

但是這條沒有很好的表明辦法， JSON 會將 undefined 對應的 key 刪除，這是 JSON 本身的轉換準則。

在 undefined 的情況下，有無該條數據是沒有區別的，由于他們在體現情勢上并無不同：

let obj1 = { a: undefined } let obj2 = {} console.log(obj1.a) // undefined console.log(obj2.a) // undefined

但必要注意的是，你約莫在調用接口時，必要對 JSON 格式的數據中的 undefied 舉行特別處理。

為什么 let undefiend = 'test' 可以掩蓋掉 JavaScript 本身的 undefined？

JavaScript 關于 undefined 的限定辦法為全局創建了一個只讀的 undefined ，但是并沒有徹底克制局部 undefined 變量的界說。

聽說在 JavaScript 高版本克制了該利用，但我沒有準確的依據。

請在任何時分，都不要舉行 undefined 變量的掩蓋，就算是你的 JSON 轉換將 undefined 轉換為 '' 。也不要經過該利用舉行，這將是及其傷害的舉動。

總結

關于使用 undefined 照舊 null

這是一條公說共有理婆說婆有理的爭議內容。
本人更傾向于使用 null ，由于這是體現界說空值的辦法。我并不克不及給出準確的來由。

但關于使用 undefined 我有一條發起：
假如你必要使用 undefined 界說空值，請不要接納以下兩種辦法：

• let a;
• let a = undefined;

進而接納底下這種辦法顯式聲明 undefined ：

• let a = void 0;

結語

終于將 undefined 和 null 的基本區別搞定了。