JavaScript中如何检查变量是否为“undefined”

技术背景

在JavaScript编程中，经常需要检查变量是否为undefined。这可能是为了避免在使用未定义的变量时出现错误，或者根据变量是否定义来执行不同的逻辑。然而，由于JavaScript的动态特性和undefined可能被重新定义的情况，检查undefined并不是一件简单的事情。

实现步骤

使用in运算符

如果你想知道一个变量是否已经被声明，而不关心其值，使用in运算符是最安全的方法。例如：

// global scope
var theFu; // theFu has been declared, but its value is undefined
typeof theFu; // "undefined"
"theFu" in window; // true
"theFoo" in window; // false

使用typeof运算符

如果你想知道变量是否未被声明或者其值为undefined，可以使用typeof运算符，它保证返回一个字符串：

if (typeof myVar !== 'undefined') {
    // 变量已定义
}

直接比较=== undefined

在大多数现代环境中，直接使用=== undefined进行比较是安全的，因为在ECMAScript 5及以上版本中，undefined是不可写的。例如：

var myVar;
if (myVar === undefined) {
    // 变量未赋值
}

使用void 0

void 0总是返回undefined，并且不会被重写，是一种可靠的检查方式：

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

核心代码

以下是各种检查undefined的代码示例：

// 使用in运算符
var theFu;
console.log("theFu" in window); // true
console.log("theFoo" in window); // false

// 使用typeof运算符
var myVar;
if (typeof myVar !== 'undefined') {
    console.log('myVar已定义');
}

// 直接比较 === undefined
var myVar;
if (myVar === undefined) {
    console.log('myVar未赋值');
}

// 使用void 0
var myVar;
if (myVar === void 0) {
    console.log('myVar是undefined');
}

最佳实践

• 在大多数情况下，推荐使用=== undefined进行比较，因为它简洁明了，并且在现代JavaScript环境中是安全的。
• 如果需要检查变量是否已经声明，可以使用in运算符。
• 对于需要兼容旧环境或者确保undefined不被重写的情况，可以使用void 0。

常见问题

undefined被重写的问题

在ECMAScript 3环境中，undefined可以被重写，导致直接比较=== undefined不可靠。但在ECMAScript 5及以上版本中，undefined是不可写的，这个问题不再存在。

未声明变量的错误

直接使用未声明的变量进行比较（如if (someUndeclaredVariable === undefined)）会抛出ReferenceError。而使用typeof运算符可以避免这个问题，因为它不会抛出错误，而是返回"undefined"。

误判假值

使用if (window.myVar)会将一些假值（如false、0、""、NaN、null、undefined）也视为未定义，不够健壮。因此，不建议使用这种方式来检查undefined。