ES11（也称为 ECMAScript 2020）是 JavaScript 的最新版本，它在 2020 年 6 月正式发布。本文将介绍 ES11 的新特性，并列出各大浏览器对这些特性的支持情况。
新特性概览
ES11 新增了以下特性：
1. 可选链操作符（Optional Chaining）
可选链操作符 ?. 可以简化代码中的条件判断，避免出现繁琐的判断语句。它的作用是判断变量是否为空或者未定义，如果是，则返回 undefined，否则返回该变量的值。
示例代码：
----- ------ - -
----- --------
-------- -
----- -----------
------- ---- ---- ----
-------- -------
-
--
---------------------------------- -- ----------
------------------------------------------- -- ---------2. 空值合并操作符（Nullish Coalescing）
空值合并操作符 ?? 可以用于判断变量是否为空或者未定义，如果是，则返回默认值。它与逻辑或操作符 || 的区别在于，?? 只有在变量为 null 或 undefined 时才返回默认值，而 || 还会在变量为 false、空字符串、0、NaN 时返回默认值。
示例代码：
----- ---- - ----- ----- ----------- - -------- ---------------- -- ------------- -- ------- ---------------- -- ------------- -- ------- ----- --- - -- ----- ---------- - --- --------------- -- ------------ -- - --------------- -- ------------ -- --
3. 动态 import()
动态 import() 可以在运行时动态加载模块，而不需要在代码中显式地引入。这个特性可以用于按需加载模块，提高应用的性能。
示例代码：
----- -------- ---------------------- - ----- ------ - ----- ------------------------------------- ------ ------- - --------------------------------- -- - -- -- --------- ---- ------ ---
4. BigInt
BigInt 是一种新的数据类型，用于表示任意精度的整数。它可以表示比 Number 类型更大的整数，甚至可以表示无限大的整数。BigInt 类型的数值必须以 n 结尾。
示例代码：
----- ---- - ------------------ ----- ---- - --------------------------- ---------------- --- ------ -- ---- ------------------ ------ -- --------
5. Promise.allSettled()
Promise.allSettled() 可以等待所有 Promise 对象都被 fulfilled 或 rejected 后返回一个数组，其中包含每个 Promise 对象的状态和结果或原因。
示例代码：
----- -------- - - --------------------------- ----------------------- -- ----------------------------------------- -- - ------------------------ -- - ------- ------------ ------ --------- - ------------------------ -- - ------- ----------- ------- ------- - ---
浏览器支持情况
下表列出了各大浏览器对 ES11 新特性的支持情况。其中，绿色表示支持，黄色表示部分支持，红色表示不支持。
| 浏览器 | 可选链操作符 | 空值合并操作符 | 动态 import() | BigInt | Promise.allSettled() |
|---|---|---|---|---|---|
| Chrome | ✓ | ✓ | ✓ | ✓ | ✓ |
| Edge | ✓ | ✓ | ✓ | ✓ | ✓ |
| Firefox | ✓ | ✓ | ✓ | ✓ | ✓ |
| Safari | ✓ | ✓ | ✓ | ✓ | ✓ |
| Opera | ✓ | ✓ | ✓ | ✓ | ✓ |
| IE | ✗ | ✗ | ✗ | ✗ | ✗ |
从表格可以看出，各大浏览器对 ES11 新特性的支持度都比较高，只有 IE 完全不支持。因此，我们可以放心地使用 ES11 的新特性来编写前端代码。
总结
ES11 新特性为我们提供了更加便捷、高效的编写 JavaScript 代码的方式。在实际开发中，我们应该充分利用这些新特性，提高代码的可读性和可维护性。同时，我们也应该注意浏览器对这些新特性的支持情况，避免出现兼容性问题。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6609ba09d10417a2228693ce