判断变量是否为 `null` 或 `undefined` 的各种写法比较

zhezhongyun 2025-10-19 15:34 18 浏览

在 JavaScript 中，判断一个变量是否为 null 或 undefined 是日常开发中非常常见的需求。虽然这两个值都表示“无值”或“空”，但它们有本质区别，而判断的方式也有多种，适用于不同场景。本文将系统总结和比较这些写法，帮助你选择合适的方式编写更健壮的代码。

一、undefined 与 null 的区别

类型	值	含义	使用场景
undefined	变量声明了但未赋值	"未定义"	系统默认赋值
null	显式赋值为 null	"空值"	表示有意的“无值”

二、各种判断方式

1. 使用宽松相等（==）

if (value == null) {
// 相当于 value === null || value === undefined
}

优点：

简洁、直观。
同时判断 null 和 undefined。

注意：

宽松相等有时会被认为不严谨，容易被误用。
不适用于 0、false、"" 这类也“falsy”的值。

2. 使用严格比较（===）

if (value === null || value === undefined) {
// 更明确的判断
}

优点：

精确控制判断条件。
更显式、语义更清晰。

缺点：

比 == null 稍显冗长。

3. 使用typeof（判断是否为undefined）

if (typeof value === 'undefined') {
// 判断未定义
}

优点：

安全地判断未声明变量。
可用于全局变量或未声明变量的判断。

** 不判断 null，仅用于检测 undefined。

4. 使用可选链与空值合并（ES2020+

let result = value ?? 'default';
// value 为 null 或 undefined 时使用 'default'

优点：

适用于赋默认值。
写法简洁，安全高效。

** 不适用于 0、false、'' 等“有效的 falsy 值”。

5. 使用== null配合逻辑非（常见于布尔上下文）

if (!(value != null)) {
// 等价于 value == null
}

虽然不推荐，但在某些场景中可能看到这样的写法。建议保持代码可读性，优先使用清晰写法。

三、实际应用建议

场景	推荐写法
判断变量为 null 或 undefined	if (value == null)
判断变量是否不为空	if (value != null)
安全读取属性	obj?.prop
给变量赋默认值	value ?? defaultValue
精确判断具体类型	if (value === null) 或 typeof value === 'undefined'

四、陷阱与误用

使用 if (!value) 的局限性：

if (!value) {
// 会错误判断 0, "", false 为“空”
}

不推荐用于判断是否为 null 或 undefined，除非明确希望将 false、0、"" 也视为“无效值”。

五、总结

写法	判断 null	判断 undefined	简洁性	可读性	推荐度
value == null			★★★★☆	★★★★☆
`value === null		value === undefined`			★★★☆☆	★★★★★
typeof value === 'undefined'			★★★☆☆	★★★☆☆
value ?? defaultValue			★★★★★	★★★★☆
if (!value)			★★★★★	★★☆☆☆	（谨慎使用）

六、附加建议

对公共函数或 API 入参，建议使用显式判断，避免类型模糊带来的副作用。
编写工具函数提高可读性，例如：

function isNil(val) {
return val == null;
}

这样在阅读代码时更具语义性：

if (isNil(user)) {
// user 为 null 或 undefined
}

结语

判断变量是否为 null 或 undefined 是基础但关键的技巧。理解每种写法的语义与适用场景，能写出更健壮、更易维护的代码。在日常开发中，推荐统一使用 value == null 或 value ?? 等更现代、更语义化的写法，提升代码一致性和可读性。

1-1. 变量声明

上一篇：02010401 类型、存储和变量_存储类或类型说明符
下一篇：更可靠的Rust-初步感受Rust:变量/常量/常见数据类型

判断变量是否为 `null` 或 `undefined` 的各种写法比较

一、undefined 与 null 的区别

二、各种判断方式

1. 使用宽松相等（==）

2. 使用严格比较（===）

3. 使用typeof（判断是否为undefined）

4. 使用可选链与空值合并（ES2020+

5. 使用== null配合逻辑非（常见于布尔上下文）

三、实际应用建议

四、陷阱与误用

使用 if (!value) 的局限性：

五、总结

六、附加建议

结语

相关推荐

HTML标签速查手册?别死记硬背了，带你从原理上掌握它!

用node.js实现一个网页爬虫（nodejs爬虫模拟浏览器）

旧手机新玩法，MacroDeck进阶指南

推荐36种免费React模板和主题「干货」

免费领取→可编辑危废标签模板首发!

业余无线电UV段几种常见天线（uv段最强天线）

今年最常见的前端面试题，你会做几道?

GitHub和码云上，7个h5页面制作工具推荐

BarTender10.1条码软件如何制作模板标签

顶级Javaer，常用的 14 个类库