JS空值合并运算符??使用详解

知识点掌握了，还需要不断练习才能熟练运用。下面golang学习网给大家带来一个文章开发实战，手把手教大家学习《JavaScript中的空值合并运算符（`??`）用于在左侧表达式为 `null` 或 `undefined` 时，返回右侧的默认值。它常用于安全地获取可能为 `null` 或 `undefined` 的值。 与逻辑或运算符（`||`）不同，空值合并运算符仅在左侧为 `null` 或 `undefined` 时才返回右侧值，而逻辑或运算符会在左侧为 falsy 值（如 `false`、`0`、`""` 等）时也返回右侧值。因此，`??` 更适合用于处理 `null` 或 `undefined` 的情况，而 `||` 更适用于处理所有 falsy 值。》，在实现功能的过程中也带大家重新温习相关知识点，温故而知新，回头看看说不定又有不一样的感悟！

空值合并运算符（??）仅在左侧为null或undefined时返回右侧值，保留0、false、''等假值；与||不同，??不将假值视为无效，适用于需区分“未定义”和“有意假值”的场景。

空值合并运算符（??）是 JavaScript 中用于提供默认值的二元操作符，它只在左侧操作数为 null 或 undefined 时返回右侧操作数；其他“假值”（如 0、false、''、NaN）都会被原样保留。

空值合并运算符的使用场景

当你想明确区分“未定义/空”和“有意设置的假值”时，?? 更安全。比如配置项允许值为 0 或空字符串，但你不希望它们被误替换成默认值：

• const timeout = config.timeout ?? 5000; → 若 config.timeout 是 0，结果就是 0，不是 5000
• const name = user.name ?? 'Anonymous'; → 只有 user.name === null 或 undefined 才用默认名

与逻辑或（||）的关键区别

|| 是“假值合并”，只要左侧为任意 falsy 值（false、0、''、null、undefined、NaN）就取右侧；而 ?? 是“空值合并”，仅对 null 和 undefined 敏感：

• 0 || 42 → 42（因为 0 是 falsy）
• 0 ?? 42 → 0（因为 0 不是 null 或 undefined）
• undefined || 'fallback' → 'fallback'
• undefined ?? 'fallback' → 'fallback'（两者行为一致）

注意事项与常见误区

?? 不能直接与 && 或 || 连用，除非加括号，否则会报语法错误：

• ❌ a ?? b || c —— 报错
• ✅ (a ?? b) || c 或 a ?? (b || c) —— 明确优先级
• ✅ a ?? b ?? c —— 支持链式，等价于 (a ?? b) ?? c

实际选择建议

选 ?? 当你关心的是“有没有真正赋值”，比如 API 返回字段可能缺失；选 || 当你确实想把所有 falsy 值都视为“无效”并兜底，比如表单校验中把空字符串也当未填写：

• 接口字段 data.count 允许为 0 → 用 data.count ?? 1
• 用户输入 input.value 空了就提示“请填写” → 用 input.value || '请填写'

今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~