深化探求：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 的基本区别搞定了。