如果你正在开发前端应用程序，你可能会遇到许多需要处理 null 或 undefined 值的情况。使用 ECMAScript 2019 中的 optional chaining 和 nullish coalescing 运算符可以简化这些情况的代码处理。
Optional Chaining 运算符
Optional chaining 运算符（?.）可以在尝试访问可能为 null 或 undefined 的属性或方法时，防止出现 TypeError 错误。它会先检查该属性或方法是否存在，如果存在则执行，否则返回 undefined。
下面是一个使用 Optional Chaining 运算符的示例：
----- ------ - -
----- -------
-------- -
----- ---- --------
-
--
---------------------------------- -- --- -------
----------------------------------- -- ---------
---------------------------------- -- ---------在上面的代码中，为 person 对象添加了一个属性 address，在 city 值后添加 ?. 可以防止出现 undefined 的错误。如果 address 不存在，则会返回 undefined，这样就不会出现 TypeError 错误。
Nullish Coalescing 运算符
代码中通常需要判断一个值是否为 null 或 undefined。在 ECMAScript 2019 中添加的 nullish coalescing 运算符（??）可以方便地解决这个问题。
Nullish Coalescing 运算符可以用来检测变量是否为 null 或 undefined。如果变量不是 null 或 undefined，则返回变量；否则返回一个默认值。
下面是一个使用 Nullish Coalescing 运算符的示例：
----- ------ - ---- -- -------- ------- -- -------- ------ ----- ------ - --------- -- -------- ------- -- -------- ------ ----- ------ - ----- -- -------- ------- -- ----- ----- ------ - - -- -------- ------- -- - ----- ------ - -- -- -------- ------- -- -- ----- ------ - -- -- -------- ------- -- --
在上面的代码中，每个表达式都包括 ?? 运算符。如果左侧的值是 null 或 undefined，则表达式会返回右侧的值；否则返回左侧的值。在这个例子中，对于默认值，可以使用任何值。
示例
在下面的代码中，使用 Optional Chaining 运算符和 Nullish Coalescing 运算符来简化处理代码：
----- ---- - -
----- -------
-------- -
------ -------------------
------ ------------
-
--
-- -- -------- -------- - ------- ---------- ------ ---- ------
----- ---- - ---------- -- --- ------
----- ----- - -------------------- -- --- -------
----- ----- - -------------------- -- --- -------
------------------ ---------- -- ----- ----
------------------- ----------- -- ------ ----------------
------------------- ----------- -- ------ ----------
-- -- ---- ---- ------
------ ----------
------ -------------------
------ -------------------
-- ---- -------- -------- - ------- ---------- ------ ---- ------
------------------ ------------ -- --- --------- -- ----- -- ----
------------------- ---------------------- -- --- ---------- -- ------ -- -----
------------------- ---------------------- -- --- ---------- -- ------ -- -----在上面的代码中，使用 Optional Chaining 运算符和 Nullish Coalescing 运算符进行了检查，当属性值不存在的时候会返回默认值。
结论
Optional Chaining 运算符和 Nullish Coalescing 运算符可以让代码更简洁而不失清晰度。它们可以使开发人员更容易地处理 null 或 undefined 值。使用这两个运算符可以大大减少代码中冗长的 null 类型判断及处理，提高代码品质。
以上就是使用 ECMAScript 2019 中的 optional chaining 和 nullish coalescing 运算符优化代码的相关内容，希望可以对前端开发人员有所帮助。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671efe882e7021665efb031b