ECMAScript 2020 (ES11) 是 JavaScript 的最新版本，其中引入了两个非常重要的新特性，即可选 Chaining 运算符和空值协调工具。这两个特性可以显著简化代码和增强可读性，也是前端开发者应该学习和掌握的。
可选 Chaining 运算符
可选 Chaining 运算符（Optional Chaining Operator）由问号（?）和点号（.）组成，可以用于访问对象中嵌套的属性或方法，同时避免因未定义的中间属性或方法而导致的错误。
下面是一个示例代码：
-- -------------------- ---- -------
--- ------ - -
----- ------
---- ---
-------- -
------- ---- ---- ----
----- ----------
------ ----
-
--
----------------------------------
---------------------------------------在这个示例中，我们可以看到，通过在 address 后面加上可选 Chaining 运算符，我们可以轻松地访问 address 嵌套的 city 属性。如果 address 或 city 未定义，那么表达式的值将为 undefined，而不是抛出错误。
同样地，我们可以使用可选 Chaining 运算符来避免访问未定义的嵌套方法。例如：
-- -------------------- ---- -------
--- ------ - -
----- ------
--------- ---------- -
------------------- - - -----------
-
--
--------------------
-----------------在这个示例中，我们可以看到，通过在 sayHello 方法后面加上可选 Chaining 运算符，我们可以轻松地调用这个方法。如果 sayHello 未定义，那么调用这个方法将不会有任何效果，没有任何错误。
空值协调工具
空值协调工具（Nullish Coalescing Operator）由两个竖线（||）组成，可以用于判断一个值是否为 null 或 undefined，如果是，返回一个默认值。
下面是一个示例代码：
let name = null; let defaultName = "Bob"; console.log(name ?? defaultName);
在这个示例中，我们可以看到，使用空值协调工具可以轻松地判断一个变量是否为 null 或 undefined，并在其为这些值时返回一个默认值。
需要注意的是，空值协调工具只会在变量为 null 或 undefined 时生效。如果变量的值为其他 Falsy 值（例如 0、"" 或 false），那么依然会返回默认值，因此在使用时需要谨慎。
总结
可选 Chaining 运算符和空值协调工具是 ECMAScript 2020 (ES11) 的两个重要特性，可以避免一些常见的错误和简化代码。这些特性都是非常有用的，前端开发者应该学习并掌握它们。
在使用这些特性时，需要注意它们的语法和使用限制，并理解它们的本质和适用场景。只有掌握了它们，才能更好地编写高效、简洁和易于维护的 JavaScript 代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651ce0b795b1f8cacd462319