做前端开发的同学，大概率见过这样的代码：if (value === void 0) { ... }。明明可以直接写 undefined，为什么非要多此一举写 void 0？

其实这不是"装大佬"，而是前端开发里的"防御性操作"，就像出门带伞——不一定下雨，但提前准备总没错。

先搞懂：undefined 和 void 0，到底是什么？

先举个生活类比：undefined 就像你家的"备用钥匙"，默认放在门口的花盆下，大家都知道它是"开门用的备用钥匙"；而 void 0，就像你随身携带的"专属钥匙"，不管家里的备用钥匙是否被人动了手脚，它都能稳稳打开门。

对应到 JavaScript 里：

• undefined：是 JS 里的"原始值"，表示"未定义"——变量声明了没赋值、函数没返回值，都会是 undefined。

• void 0：void 是 JS 的一个运算符，不管后面跟什么表达式（0、1、"hello" 都可以），它的结果永远是 undefined。用 0 只是因为最简洁、无副作用，就像用"123456"当密码（不是最安全，但最省事）。

核心原因1：undefined 能被"动手脚"，void 0 不行

这是最关键的一点。早期 JS 里，undefined 不是"固定不变"的，它更像一个"可修改的标签"——就像你家的备用钥匙，别人能偷偷换成别的钥匙，导致你拿备用钥匙开不了门。

看代码示例（旧环境/非严格模式下可运行）：

// 把 undefined 改成 123，居然能成功！
undefined = 123;
console.log(undefined); // 输出 123（旧环境中）
console.log(void 0);    // 依然输出 undefined，不受影响

虽然 ES5 之后，全局的 undefined 变成了"只读"，改不了了，但局部作用域里依然能"踩坑"：

// 局部作用域中，依然能定义名为 undefined 的变量
function test() {
  const undefined = "我不是未定义";
  console.log(undefined); // 输出"我不是未定义"
  console.log(void 0);    // 依然输出 undefined
}

类比一下：这就像公司的"备用公章"（undefined），虽然总部规定不能动，但部门里有人偷偷刻了个假的替换，不知情的人用了，就会出大问题；而 void 0，就是你自己的"私人印章"，不管别人怎么造假，你的印章永远有效。

核心原因2：更简洁，代码压缩更友好

开发中，代码最终会被压缩（减小文件体积，提升加载速度）。undefined 有 9 个字符，void 0 只有 6 个字符——看似差别不大，量大了就能省很多空间。

比如这段代码：

// 原始代码
if (name === undefined) {
  console.log("未传入姓名");
}
// 压缩后（用 void 0 更简洁）
if(a===void 0){console.log("未传入姓名")}

类比：就像发消息，"收到"比"我已经收到你的消息了"更简洁，不影响意思，但省时间、省流量。

额外福利：void 0 的实用小场景

除了代替 undefined，void 0 还有个常用场景——阻止链接跳转，这个场景恰恰能体现它"返回 undefined"的核心特性，比如：

<!-- 点击链接不会跳转，只执行点击事件，核心是 void 0 返回 undefined，阻止默认跳转行为 -->
<a href="javascript:void(0)" onclick="alert('点击触发事件，不跳转')">点击触发事件</a>
<!-- 对比：若 href 写 #，点击会跳转到页面顶部，而 void 0 可完美避免 -->
<a href="#" onclick="alert('点击会跳转到顶部')">对比测试</a>

这里的关键是：浏览器会默认执行 href 里的代码，若代码返回 undefined（void 0 的核心作用），就不会触发跳转；如果写 #、javascript:'' 等，反而会有跳转、滚动等副作用，这正是 void 0 在该场景的优势，和它的核心特性紧密相关。

一张表看懂两者区别

最后总结

• 现代开发中，全局 undefined 已经很安全，但为了避免局部作用域的坑，核心逻辑用 void 0 更稳妥。

• 写库、框架或需要兼容旧环境时，优先用 void 0，保证代码稳定性。

• 日常开发写业务代码，直接用 undefined 也没问题，简洁直观。

其实 void 0 代替 undefined，本质是"防坑"——就像程序员的"安全气囊"，平时用不上，但关键时刻能避免大问题。掌握这个小技巧，你的代码会更健壮。

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://fly63.com/article/detial/13619