ECMAScript 2018（也被称为 ES9）是 JavaScript 最新的版本，它包含了一些新的特性和语言改进。这些特性有助于提高代码的可读性、可维护性和性能。在本文中，我们将介绍 ES9 中的五个新特性，并给出相应的示例代码。
1. 异步迭代
异步迭代是 ES9 中最重要的新特性之一。它允许我们在异步代码中使用 for...of 循环，而不需要等待每个迭代完成。这个特性对于处理大量异步数据非常有用。
下面是一个使用异步迭代的示例代码：
async function fetchPosts() {
const response = await fetch('https://jsonplaceholder.typicode.com/posts');
const posts = await response.json();
for await (const post of posts) {
console.log(post.title);
}
}在这个示例中，我们使用了 for...of 循环迭代异步获取的博客文章。由于我们使用了 async 和 await 关键字，因此我们可以直接在循环中使用异步函数。
2. Promise.prototype.finally()
Promise.prototype.finally() 方法是一个新的 Promise 方法，它与 then() 和 catch() 方法类似，但是它不管 Promise 的状态如何，都会执行一段代码。这个方法对于清理资源或执行一些必要的操作非常有用。
下面是一个使用 Promise.prototype.finally() 的示例代码：
fetch('https://jsonplaceholder.typicode.com/posts')
.then(response => response.json())
.then(posts => console.log(posts))
.catch(error => console.log(error))
.finally(() => console.log('Done fetching posts'));在这个示例中，我们使用了 Promise.prototype.finally() 方法来输出一条消息，表示我们已经完成了获取博客文章的操作。
3. Rest/Spread 属性
Rest/Spread 属性是一种新的对象属性语法，它允许我们在对象字面量中使用 ... 操作符来表示剩余的属性或扩展的属性。这个特性对于处理对象属性非常有用。
下面是一个使用 Rest/Spread 属性的示例代码：
const person = { name: 'John', age: 30, address: '123 Main St.' };
const { name, ...rest } = person;
console.log(name); // "John"
console.log(rest); // { age: 30, address: '123 Main St.' }
const newPerson = { ...person, email: 'john@example.com' };
console.log(newPerson); // { name: 'John', age: 30, address: '123 Main St.', email: 'john@example.com' }在这个示例中，我们使用了 Rest/Spread 属性来从 person 对象中提取 name 属性，并将剩余的属性存储在 rest 变量中。我们还使用了 Rest/Spread 属性来创建一个新的对象 newPerson，其中包含了 person 对象的所有属性以及一个新的 email 属性。
4. 正则表达式命名捕获组
正则表达式命名捕获组是一种新的正则表达式语法，它允许我们为捕获组命名。这个特性对于处理正则表达式非常有用。
下面是一个使用正则表达式命名捕获组的示例代码：
const regex = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;
const match = regex.exec('2021-06-30');
console.log(match.groups.year); // "2021"
console.log(match.groups.month); // "06"
console.log(match.groups.day); // "30"在这个示例中，我们使用了正则表达式命名捕获组来提取日期字符串中的年、月和日。我们使用了 ?<name> 语法来为每个捕获组命名，并使用 match.groups 属性来访问捕获组的值。
5. 模板字面量标签函数的 raw 属性
模板字面量标签函数是一种新的语法，它允许我们在模板字面量前面添加一个函数，这个函数会处理模板字面量中的值。ES9 中，我们可以通过访问 raw 属性来获取模板字面量的原始字符串。
下面是一个使用模板字面量标签函数的示例代码：
function log(strings, ...values) {
console.log(strings.raw[0] + values[0] + strings.raw[1] + values[1]);
}
const name = 'John';
const age = 30;
log`My name is ${name} and I'm ${age} years old.`;
// Output: "My name is John and I'm 30 years old."在这个示例中，我们定义了一个 log() 函数来处理模板字面量。我们使用了 strings.raw 属性来获取模板字面量的原始字符串，并在函数中将它们连接起来输出。
结论
ES9 中的这些新特性为 JavaScript 开发者提供了更多的工具来编写更加高效、可读性和可维护性的代码。我们希望这篇文章能够帮助你更好地理解这些特性，并在实际开发中使用它们。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6726d52f2e7021665e1b5f9d