ECMAScript 2020（ES11）是 JavaScript 语言的最新版本，它于 2020 年 6 月正式发布。本文将介绍 ES11 中新增的一些重要功能，并提供相应的示例代码。
1. 可选链操作符（Optional Chaining Operator）
可选链操作符是一种简化 JavaScript 代码的语法糖。它可以用来判断对象或数组中是否存在某个属性或元素，从而避免了在代码中使用大量的 if 判断语句。可选链操作符使用问号（?）来表示。
// www.javascriptcn.com code example
// 在 ES10 中，我们需要这样写代码来判断一个对象属性是否存在
if (obj && obj.prop1 && obj.prop1.prop2) {
// do something
}
// 在 ES11 中，我们可以使用可选链操作符来简化代码
if (obj?.prop1?.prop2) {
// do something
}2. 空值合并操作符（Nullish Coalescing Operator）
空值合并操作符也是一种语法糖，它可以用来判断某个变量是否为 null 或 undefined。如果是，就返回一个默认值。空值合并操作符使用两个竖杠（||）来表示。
// 在 ES10 中，我们需要这样写代码来判断某个变量是否为 null 或 undefined const value = (variable !== null && variable !== undefined) ? variable : 'default'; // 在 ES11 中，我们可以使用空值合并操作符来简化代码 const value = variable ?? 'default';
3. Promise.allSettled 方法
Promise.allSettled 方法可以接收一个 Promise 数组，并返回一个新的 Promise，该 Promise 在所有 Promise 都被解决后才会被解决。与 Promise.all 方法不同的是，Promise.allSettled 方法会等待所有 Promise 被解决，而不管它们是否被解决成功或失败。
// www.javascriptcn.com code example
const promises = [
Promise.resolve('resolved'),
Promise.reject('rejected'),
Promise.resolve('resolved again')
];
Promise.allSettled(promises).then(results => {
console.log(results);
});
// 输出结果：
// [
// { status: 'fulfilled', value: 'resolved' },
// { status: 'rejected', reason: 'rejected' },
// { status: 'fulfilled', value: 'resolved again' }
// ]4. String.prototype.matchAll 方法
String.prototype.matchAll 方法可以用于在字符串中查找所有匹配的子串，并返回一个迭代器。迭代器中的每个元素都是一个匹配对象，包含匹配的子串以及相关的信息。
// www.javascriptcn.com code example
const str = 'hello world';
const regex = /[a-z]/g;
const matches = str.matchAll(regex);
for (const match of matches) {
console.log(match);
}
// 输出结果：
// { 0: 'h', index: 0, input: 'hello world' }
// { 0: 'e', index: 1, input: 'hello world' }
// { 0: 'l', index: 2, input: 'hello world' }
// { 0: 'l', index: 3, input: 'hello world' }
// { 0: 'o', index: 4, input: 'hello world' }
// { 0: 'w', index: 6, input: 'hello world' }
// { 0: 'o', index: 7, input: 'hello world' }
// { 0: 'r', index: 8, input: 'hello world' }
// { 0: 'l', index: 9, input: 'hello world' }
// { 0: 'd', index: 10, input: 'hello world' }5. 动态 import
动态 import 是一种新的语法，它可以让我们在运行时动态地加载一个模块。这种语法非常适合在需要时才加载一些较大的模块，从而提高应用的性能。
const module = await import('./module.js');结语
以上是 ES11 中一些重要的功能介绍。这些功能的加入，使得 JavaScript 语言更加强大和易用。我们可以在实际开发中灵活运用这些新特性，从而提高开发效率和代码质量。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d93571a941bf71340bf844