理解空值合并运算符 ?? 的基本行为
工作原理与短路机制
在 JavaScript 中，空值合并运算符 ?? 的核心规则是：左操作数为 null 或 undefined 时，才返回右操作数；否则返回左操作数。这一机制使其成为为变量设定“默认值”的强大工具。通过这种方式，你可以在不干扰已赋值的情形下，提供一个安全的后备值。默认值的设定变得更加直观，且对非空值的保留更加高效。
与其他常见的默认值写法相比，空值合并运算符专注于 null 与 undefined 的情况，而忽略诸如 0、''、false 等“假值”导致的误判。这一点对于需要确认实际缺失值的场景尤为重要。这有助于避免无谓的覆盖，从而保持数据的准确性。
let a = 0 ?? 5; // 0
let b = null ?? 5; // 5
let c = undefined ?? 'default'; // 'default'与 nullish 的区分要点
在实际开发中，null 与 undefined 虽然都被视为“空值”，但来源可能不同。使用 ?? 时，只有这两个值会触发右侧值，这让你能够对数据缺失做出一致的处理。理解这一点对于避免意外覆盖至关重要。不同于传统的逻辑或运算符，它不会把 0、''、false 等错误地当作空值处理。
当处理对象或数组中的字段时，能清晰地理解：若字段为 null 或 undefined，则用默认值替代；若字段为其他值（包括 0、''、false），则保持原值。这使得数据的完整性和可预测性更高。
function getName(input) {return input ?? 'Guest';
}
console.log(getName(0)); // 0
console.log(getName(null)); // 'Guest'
console.log(getName(undefined)); // 'Guest'空值合并运算符在默认值设置的实战技巧
与解构和默认值的结合
在解构赋值场景中，通常会给未定义字段设默认值，例如 const { a = 1 } = obj，但这并不会对 null 生效。如果希望在对象字段为 null 时也应用默认值，建议使用 显式的 ?? 组合进行覆盖。
通过将解构后的值与 nullish 运算符结合，可以实现更细粒度的默认化效果，提升数据鲁棒性。这在处理来自外部 API 的响应时尤为有用，因为哪些字段可能出现 null 需要额外保护。
const data = { a: null, b: undefined, c: 0, d: '' };
const a = data.a ?? 10;
const b = data.b ?? 20;
const c = data.c ?? 30;
const d = data.d ?? 'x';
console.log({ a, b, c, d });
// { a: 10, b: 20, c: 0, d: '' }在函数、参数与配置对象中的应用
在函数参数和配置对象处理中，使用 ?? 可以区分未传入值与显式传入 null，从而给出恰当的默认值。与简单的默认参数相比，明确处理 null 的能力更强。
示例展示了在函数内部对传入参数进行默认化的写法：当参数为 undefined 或 null 时，返回默认值；当传入 0、''、false 等实际值时，保持原值，体现了强制性与灵活性的平衡。
function greet(name) {const nm = name ?? 'Guest';return `Hi, ${nm}`;
}
console.log(greet('Alice')); // Hi, Alice
console.log(greet(null)); // Hi, Guest
console.log(greet(undefined)); // Hi, Guest
console.log(greet(0)); // Hi, 0// 配置对象合并
const config = { limit: null, mode: undefined };
const final = {limit: config.limit ?? 100,mode: config.mode ?? 'auto'
};
console.log(final); // { limit: 100, mode: 'auto' }实战中的最佳实践与注意事项
与类型系统的配合与工具支持
在 TypeScript 等类型强语言中，合理结合类型断言和空值合并运算符，能提升代码可读性与类型安全性。通过将工作流中的默认值逻辑用 ?? 表达，可以让类型推断更清晰并减少运行时错误。示例中用到的类型注解应覆盖可能的 null/undefined 情况，确保编译阶段就能捕获潜在问题。
下面是一个简单的 TypeScript 示例：opts.limit 的默认值通过 ?? 提供，当 opts.limit 为 null 或 undefined 时，使用 10；其他情况保持传入值。
function init(opts: { limit?: number | null }) {const limit = opts.limit ?? 10;// 进一步的逻辑
}
兼容性与性能的注意事项
空值合并运算符在现代浏览器中得到广泛支持，但在 very 老的环境中可能需要合适的 polyfill 或编译阶段的转译。对于性能，比起复杂的条件判断，使用 ?? 的字面量替代通常更简洁高效，但在极端对比场景中应进行基准测试以确保不会成为瓶颈。保持代码简洁性和可读性优先，避免不必要的混用。
为了避免歧义，在混合使用 ?? 与 ||、&& 时尽量显式加括号，例如：
const value = (a ?? b) || c; // 避免 a ?? b || c 的歧义与代码可读性和风格的结合
在团队协作中，统一的默认值策略至关重要，建议将空值合并运算符的使用规范化为明确的代码风格。将涉及默认值的逻辑集中在一个地方（如工具函数或配置初始化），有助于减少重复、提高一致性。可读性与维护性是长期回报的关键。
如果你的项目对可预测性要求极高，建议结合静态分析工具（如 ESLint）的规则，确保在默认值处理处使用 ??，并对混合运算符的用法给出明确提示，从而降低潜在风险。
