使用 ES12 的 Nullish Coalescing Operator 处理空值-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们经常需要处理空值。传统的方法是使用三元运算符或逻辑或运算符来判断一个值是否为空，但是这些方法不够简洁，而且容易出错。ES12 引入了 Nullish Coalescing Operator（空值合并运算符），可以更方便地处理空值。

Nullish Coalescing Operator 是什么？

Nullish Coalescing Operator 是一个新的运算符，表示当左侧的表达式为 null 或 undefined 时，返回右侧的表达式。它使用两个问号（??）表示。

以下是一个简单的示例：

const foo = null ?? 'default string';
console.log(foo); // 'default string'

在上面的代码中，foo 的值为 null，因此使用 ?? 运算符返回了右侧的字符串。

Nullish Coalescing Operator 的优点

Nullish Coalescing Operator 相对于传统的方法有以下优点：

更简洁：使用 ?? 运算符可以更方便地处理空值，避免了繁琐的判断语句。
更安全：传统的方法在判断空值时，空字符串、0、false 等值也会被当作空值处理，而 ?? 运算符只会在左侧的值为 null 或 undefined 时返回右侧的值，避免了误判。

使用 Nullish Coalescing Operator 处理空值

以下是使用 Nullish Coalescing Operator 处理空值的示例代码：

const foo = null ?? 'default string';
console.log(foo); // 'default string'

const bar = undefined ?? 'default string';
console.log(bar); // 'default string'

const baz = '' ?? 'default string';
console.log(baz); // ''

const qux = 0 ?? 'default string';
console.log(qux); // 0

const quux = false ?? 'default string';
console.log(quux); // false

在上面的代码中，使用 ?? 运算符处理了 null、undefined 和空字符串的情况。当左侧的值为 0 或 false 时，也不会被认为是空值，而是返回原值。

总结

Nullish Coalescing Operator 是一个新的运算符，可以更方便地处理空值。它的优点是更简洁、更安全，避免了传统方法中的误判。在实际开发中，我们可以使用 ?? 运算符来处理空值，提高代码的可读性和健壮性。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65bdd972add4f0e0ff7759cc