突破前端开发面试（四）：你真的分得清JavaScript中的null、undefined和未声明变量吗？

导言

JavaScript中的null、undefined和未声明变量是常见的概念，它们经常会引起混淆。本文将解密这些概念，让您明白它们之间的区别，以及如何检测它们。在简洁的答案中：

null： null表示一个特定对象的值不存在，通常是有意地赋予变量一个空值。这是一个明确定义的状态，可通过严格相等运算符（===）来检查。
undefined： undefined表示一个变量已声明但尚未赋值，或者函数没有返回值，或者对象属性不存在。它是变量的默认状态，也可通过严格相等运算符（===）来检查。
未声明变量： 未声明变量是指在代码中引用的变量，但在当前作用域中尚未声明的变量。要检查未声明变量，可以使用typeof运算符，或者通过捕捉ReferenceError异常。

在本文中，我们将深入探讨这些概念，提供详细的解释和示例，以帮助您更好地理解它们，提高您在JavaScript编程中的能力。

问题的答案

当你没有提前使用var、let或const声明变量，就为一个变量赋值时，该变量是未声明变量（undeclared variables）。未声明变量会脱离当前作用域，成为全局作用域下定义的变量。在严格模式下，给未声明的变量赋值，会抛出ReferenceError错误。和使用全局变量一样，使用未声明变量也是非常不好的做法，应当尽可能避免。要检查判断它们，需要将用到它们的代码放在try/catch语句中。

js 复制代码

function foo() {  
x = 1; // 在严格模式下，抛出 ReferenceError 错误  
}  
  
foo();  
console.log(x); // 1

当一个变量已经声明，但没有赋值时，该变量的值是undefined。如果一个函数的执行结果被赋值给一个变量，但是这个函数却没有返回任何值，那么该变量的值是undefined。要检查它，需要使用严格相等（===）；或者使用typeof，它会返回'undefined'字符串。请注意，不能使用非严格相等（==）来检查，因为如果变量值为null，使用非严格相等也会返回true。

js 复制代码

var foo;  
console.log(foo); // undefined  
console.log(foo === undefined); // true  
console.log(typeof foo === 'undefined'); // true  
  
console.log(foo == null); // true. 错误，不要使用非严格相等！  
  
function bar() {}  
var baz = bar();  
console.log(baz); // undefined

null只能被显式赋值给变量。它表示空值，与被显式赋值 undefined 的意义不同。要检查判断null值，需要使用严格相等运算符。请注意，和前面一样，不能使用非严格相等（==）来检查，因为如果变量值为undefined，使用非严格相等也会返回true。

js 复制代码

var foo = null;  
console.log(foo === null); // true  
  
console.log(foo == undefined); // true. 错误，不要使用非严格相等！

作为一种个人习惯，我从不使用未声明变量。如果定义了暂时没有用到的变量，我会在声明后明确地给它们赋值为null。

参考

正文

1. null

null是什么？

null 表示一个特定对象的值不存在。它是一种明确的状态，通常用于表示变量被有意地赋予了一个空值。这可以在编程中有多种用途，例如重置对象属性或指示变量不包含有效数据。

如何检测null？

要检测变量是否为null，您可以使用严格相等运算符（===）来比较它与null。如果两者相等，那么变量的值为null。

js 复制代码

if (myVar === null) {
    // 变量是null
}

2. undefined

undefined是什么？

undefined 表示一个变量已声明但尚未赋值，或者函数没有返回值，或对象属性不存在。它是变量的默认状态，在许多情况下，它不是有意赋予的，而是由JavaScript引擎自动生成。

如何检测undefined？

与null一样，使用严格相等运算符（===）来检查变量是否为undefined。如果一个变量的值等于undefined，那么它是undefined。

js 复制代码

if (myVar === undefined) {
    // 变量是undefined
}

3. 未声明变量

未声明变量是什么？

未声明变量指的是在代码中引用的变量，但在当前作用域中尚未声明的变量。这种情况通常会导致ReferenceError异常。

如何检测未声明变量？

要检测未声明变量，可以使用typeof运算符或捕捉ReferenceError异常。

js 复制代码

if (typeof myVar === "undefined") {
    // 变量是未声明的
}

或者

js 复制代码

try {
    if (myVar === undefined) {
        // 变量是未声明的
    }
} catch (e) {
    // 捕捉ReferenceError异常
}

结论

JavaScript中的null、undefined和未声明变量是程序员在日常开发中经常会遇到的概念。在本文中，我们解开了它们之间的谜团，提供了清晰的定义和检测方法。下面是我们总结的重点观点：

null 是一个有意赋予的空值，通常表示特定对象的值不存在。通过使用严格相等运算符（===），我们可以轻松检测null。
undefined 是变量的默认状态，表示变量已声明但尚未赋值，或者函数没有返回值，或者对象属性不存在。同样，通过使用严格相等运算符（===），我们可以检测undefined。
未声明变量 是指在代码中引用，但在当前作用域中尚未声明的变量。要检测未声明变量，我们可以使用typeof运算符或捕捉ReferenceError异常。

为什么这些区别重要？了解它们有助于避免常见的编程错误，提高代码的可读性和可维护性。在处理变量时，正确地检测和处理这些状态值是一项关键技能，可以提高您的编程能力，减少调试时间，同时确保代码的稳定性。