JavaScript ES10 中的空值合并操作符（??）简介

JavaScript ES10 中的空值合并操作符（??）简介

JavaScript ES10（也称为 ECMAScript 2019）是 JavaScript 语言的最新规范，其中包含了许多新特性和语法。其中一个令人兴奋的特性是空值合并操作符（nullish coalescing operator），其操作符为 ??。

在 JavaScript 中，当需要为一个变量或属性赋值时，经常需要检查其当前值是否为 null 或 undefined，如果是，则给它一个默认值。这通常可以使用三元运算符来实现，例如：

let foo = null;
let bar = foo ? foo : 'default'; // bar = 'default'

但是，这种写法可能会因为类型转换而导致错误。例如，当 foo 的值为 0 或空字符串 '' 时，上述代码也会将其视为 false，进而选取默认值。

为了避免这种错误，JavaScript ES10 引入了空值合并操作符 ??。使用 ?? 运算符，可以判断一个值是否为 null 或 undefined，并在它们是时返回一个默认值。示例如下：

let foo = null;
let bar = foo ?? 'default'; // bar = 'default'

这个例子中，当 foo 的值为 null 或 undefined 时，bar 的值为 'default'。

需要注意的是，空值合并操作符仅仅对 null 或 undefined 生效。其他 falsy 值，如 0 或 ''，仍然会视为真实的值。如果要同时兼顾这些值，你需要使用逻辑或操作符 ||。

下面的例子说明了 ?? 操作符和 || 操作符之间的差异：

let foo = ''; // 空字符串 '' 被视为 falsy 值
let bar = foo ?? 'default'; // bar = ''
let baz = foo || 'default'; // baz = 'default'

从上述例子中可以看出，当 foo 的值为 '' 时，?? 操作符并没有为 bar 赋值默认值，而 || 操作符将会选择默认值 'default'。

总之，空值合并操作符让我们可以更加简洁地实现给变量或属性赋默认值的操作，同时避免了类型转换的风险。在以后的项目中，可以考虑使用这个新特性提高代码的安全性和可读性。

总结

本文介绍了 JavaScript ES10 中的空值合并操作符（??）。我们可以使用它来为变量或属性赋一个默认值，同时避免了类型转换可能引起的问题。需要注意的是，?? 操作符只对 null 或 undefined 生效，其他 falsy 值需要使用逻辑或操作符 ||。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649ea51948841e9894b2fb44