随着 Javascript 的不断发展,它的新增特性也越来越多。其中,ES11 中最具代表性的新特性之一就是 Nullish Coalescing 运算符,这个运算符可以帮助开发者更好地处理空值(undefined 和 null)。
概述
在 Javascript 中,当变量值为 undefined 或 null 时,它们会被视为 falsy 值。在实际开发中,我们有时会需要判断一个变量是否为真实有效的值,而不是空值。通常的做法是使用逻辑或(||)运算符。
const value = undefined || 'default'; console.log(value); // 'default'
在上述代码中,由于变量 value 的值为 undefined,逻辑或运算符会将其转换为 falsy 值,因此会返回默认值。
然而,当我们希望变量的值为 0 或空字符串时,逻辑或运算符会误认为这些值也是空值。此时,Nullish Coalescing 运算符就派上了用场。
Nullish Coalescing 运算符
Nullish Coalescing 运算符使用两个问号(??)表示。它只会在变量值为 null 或 undefined 时返回默认值,而对于其他 falsy 值,则会返回该变量的实际值。
const value = null ?? 'default'; console.log(value); // 'default' const zero = 0 ?? 'default'; console.log(zero); // 0 const empty = '' ?? 'default'; console.log(empty); // ''
通过上面的示例,我们可以看到在使用 Nullish Coalescing 运算符时,如果变量的实际值为 0 或空字符串,它们并不会被视为 null 或 undefined,因此不会触发返回默认值的逻辑。
应用场景
在使用 Nullish Coalescing 运算符时,我们通常会使用它来赋予变量默认值。这种做法在处理配置文件或者 API 返回值等场景中非常常见。例如:
-- -------------------- ---- ------- ----- ------ - - ----- ------------ ----- ----- -------- ---- -- ----- ---- - ----------- -- ------------ ----- ---- - ----------- -- --- ----- ------- - -------------- -- -----
上述代码中,我们利用 Nullish Coalescing 运算符为配置对象(config)中的三个属性赋予了默认值。如果这些属性值为 null 或 undefined,我们会用默认值替代它们。
除此之外,Nullish Coalescing 运算符还可以用于处理函数参数。
function getUsers(page = 1, limit = 10) { // ... } getUsers(0, 20); // page 为 0,并非 undefined,因此不会使用默认值 getUsers(null, 20); // page 为 null,则使用默认值 1 getUsers(undefined, 20); // page 为 undefined,则使用默认值 1
总结
Nullish Coalescing 运算符是 ES11 中一个非常实用的新特性。当我们需要给变量赋默认值时,可以考虑使用这个运算符。同时,为了保证代码的兼容性,在使用这个运算符时,我们需要在 build 过程中引入 polyfill。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65afc5b5add4f0e0ff93a7b6