ES2020 如何处理 Nullish Coalescing Operator 的异同？-JavaScript中文网-JavaScript教程资源分享门户

在ES2020中，Nullish Coalescing Operator是一个新的操作符，它允许我们在变量为null或undefined时提供默认值。

Nullish Coalescing Operator

Nullish Coalescing Operator用两个问号（??）表示，它的作用是判断一个变量是否为null或undefined，如果是，则返回一个默认值。

const foo = null ?? 'default'; // 'default'
const bar = undefined ?? 'default'; // 'default'
const baz = 0 ?? 'default'; // 0
const qux = '' ?? 'default'; // ''

从上面的例子可以看出，如果变量不是null或undefined，则返回该变量的值；如果是null或undefined，则返回默认值。

Nullish Coalescing Operator与OR操作符的区别

Nullish Coalescing Operator与OR操作符（||）有一些区别：

const foo = '' || 'default'; // 'default'
const bar = null || 'default'; // 'default'
const baz = undefined || 'default'; // 'default'
const qux = 0 || 'default'; // 'default'

OR操作符会把所有falsy值（如空字符串、null、undefined、0等）都视为false，因此如果变量为falsy值，则返回默认值。而Nullish Coalescing Operator只会把null和undefined视为false，其他falsy值都不会被视为false，因此如果变量为falsy值但不是null或undefined，则返回该变量的值。

Nullish Coalescing Operator和短路求值

Nullish Coalescing Operator和短路求值（Short-circuit Evaluation）有些类似，都是在判断一个条件时可以提供默认值。但它们之间也有一些区别。

短路求值是在判断一个条件时，如果第一个条件为false，则直接返回第一个条件的值，不再执行后面的代码。而Nullish Coalescing Operator会判断一个变量是否为null或undefined，如果是，则返回默认值，否则返回该变量的值。

const foo = false && 'default'; // false
const bar = null ?? 'default'; // 'default'

总结

Nullish Coalescing Operator是一个非常有用的操作符，它可以让我们更方便地处理变量为null或undefined的情况。它的使用方法和OR操作符和短路求值有些类似，但也有一些区别。在实际开发中，我们可以根据具体情况选择使用这三种操作符中的一种。

参考代码

// javascriptcn.com 代码示例
const foo = null ?? 'default'; // 'default'
const bar = undefined ?? 'default'; // 'default'
const baz = 0 ?? 'default'; // 0
const qux = '' ?? 'default'; // ''

const foo1 = '' || 'default'; // 'default'
const bar1 = null || 'default'; // 'default'
const baz1 = undefined || 'default'; // 'default'
const qux1 = 0 || 'default'; // 'default'

const foo2 = false && 'default'; // false
const bar2 = null ?? 'default'; // 'default'

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