ES11（也称为 ES2020）是 JavaScript 的最新版本，于 2020 年 6 月正式发布。本文将介绍 ES11 中的新特性，并提供详细的示例代码和指导意义。
1. 可选链操作符
在 ES11 中，新增了一种可选链操作符（Optional Chaining Operator），用于简化访问嵌套对象的代码。这个操作符是 ?.，它可以在访问一个对象的属性或方法时，判断该对象是否为 null 或 undefined，如果是，则返回 undefined，不会抛出异常。
示例代码：
// javascriptcn.com 代码示例
const person = {
name: 'Alice',
address: {
city: 'Beijing',
street: 'No. 123'
}
};
console.log(person.address?.city); // "Beijing"
console.log(person.address?.zipCode); // undefined
console.log(person.phone?.number); // undefined在上面的代码中，使用了可选链操作符 ?.，可以避免访问 undefined 的属性或方法，从而避免了异常的抛出。这样的代码更加简洁和安全。
2. 空值合并操作符
在 ES11 中，还新增了一种空值合并操作符（Nullish Coalescing Operator），用于处理 null 或 undefined 值的情况。这个操作符是 ??，它可以在一个表达式中，判断左侧的操作数是否为 null 或 undefined，如果是，则返回右侧的操作数，否则返回左侧的操作数。
示例代码：
const name = null ?? 'Unknown'; console.log(name); // "Unknown" const age = undefined ?? 18; console.log(age); // 18 const salary = 0 ?? 10000; console.log(salary); // 0
在上面的代码中，使用了空值合并操作符 ??，可以在处理 null 或 undefined 值的情况时，更加方便和简洁。
3. Promise.allSettled 方法
在 ES11 中，新增了一个 Promise.allSettled 方法，用于同时处理多个 Promise 对象，不管它们是成功还是失败。这个方法返回一个 Promise 对象，它的结果是一个数组，包含所有 Promise 对象的状态和值。
示例代码：
// javascriptcn.com 代码示例
const p1 = Promise.resolve(1);
const p2 = Promise.reject('Error');
const p3 = Promise.resolve(3);
Promise.allSettled([p1, p2, p3])
.then(results => {
console.log(results);
})
.catch(error => {
console.log(error);
});在上面的代码中，使用了 Promise.allSettled 方法，可以同时处理多个 Promise 对象，不管它们是成功还是失败。这样的代码更加简单和灵活。
4. String.prototype.matchAll 方法
在 ES11 中，新增了一个 String.prototype.matchAll 方法，用于在一个字符串中查找所有匹配的子串，并返回一个迭代器对象。这个方法接受一个正则表达式作为参数，可以使用正则表达式的捕获组来获取匹配的子串。
示例代码：
const str = 'Hello, world!';
const regex = /\w+/g;
const matches = str.matchAll(regex);
for (const match of matches) {
console.log(match[0]);
}在上面的代码中，使用了 String.prototype.matchAll 方法，可以在一个字符串中查找所有匹配的子串，并遍历它们。这样的代码更加方便和高效。
5. 动态 import()
在 ES11 中，还支持动态 import()，用于动态加载模块。这个方法返回一个 Promise 对象，可以使用 async/await 或 then/catch 来处理加载模块的结果。
示例代码：
// javascriptcn.com 代码示例
async function loadModule(moduleName) {
const module = await import(`./modules/${moduleName}.js`);
return module;
}
loadModule('example')
.then(module => {
module.run();
})
.catch(error => {
console.log(error);
});在上面的代码中，使用了动态 import() 方法，可以动态加载模块，并处理加载结果。这样的代码更加灵活和可维护。
总结
ES11 中的新特性包括可选链操作符、空值合并操作符、Promise.allSettled 方法、String.prototype.matchAll 方法和动态 import()。这些新特性可以让 JavaScript 代码更加简洁、安全、高效和灵活。我们可以根据实际需求，灵活运用这些新特性，提升开发效率和代码质量。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/653b82eb7d4982a6eb5da2dc