在前端开发中，我们经常需要处理变量值为空或未定义的情况。在 ECMAScript 2021（ES12）中，新增了一个空值合并运算符（nullish coalescing operator），可以方便地处理这种情况。
空值合并运算符的作用
空值合并运算符的作用是，如果左侧操作数的值为 null 或 undefined，则返回右侧操作数的值，否则返回左侧操作数的值。
具体来说，如果左侧操作数的值为 null 或 undefined，则返回右侧操作数的值；否则返回左侧操作数的值。这个过程是短路运算的，即如果左侧操作数的值为真，则不会执行右侧操作数的求值过程。
空值合并运算符的语法
空值合并运算符的语法是 ??，例如：
----- ------ - - -- --
这个表达式的含义是，如果变量 a 的值为 null 或 undefined，则返回变量 b 的值；否则返回变量 a 的值。
空值合并运算符的示例
下面是一个使用空值合并运算符的示例：
----- -------- - --------- -- --------
这个代码片段的含义是，如果函数 getUser() 返回的值为 null 或 undefined，则变量 username 的值为 'Guest'；否则变量 username 的值为函数 getUser() 的返回值。
空值合并运算符的注意事项
需要注意的是，空值合并运算符只会在左侧操作数的值为 null 或 undefined 时返回右侧操作数的值。如果左侧操作数的值为其他 falsy 值（例如空字符串、0、NaN、false），则仍然会返回左侧操作数的值。
下面是一个使用空值合并运算符的错误示例：
----- ------ - - -- -- -- -- ----- -
这个代码片段的含义是，如果变量 result 的值为 0，则返回 1；否则返回 0。但是，由于 0 是 falsy 值，所以空值合并运算符会返回左侧操作数的值，即 0。
空值合并运算符的指导意义
空值合并运算符可以方便地处理变量值为空或未定义的情况，使代码更加简洁和易读。同时，需要注意空值合并运算符只能处理 null 和 undefined 值，而不能处理其他 falsy 值。
在实际开发中，我们可以结合空值合并运算符和其他语言特性，例如 Optional Chaining（可选链操作符）和默认参数值，来更加方便地处理变量值为空或未定义的情况，提高代码的可读性和可维护性。
总结
空值合并运算符是 ECMAScript 2021（ES12）中的一个新增特性，可以方便地处理变量值为空或未定义的情况。需要注意空值合并运算符只能处理 null 和 undefined 值，而不能处理其他 falsy 值。在实际开发中，我们可以结合空值合并运算符和其他语言特性，来更加方便地处理变量值为空或未定义的情况，提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f381b62b3ccec22fbfb4ef