ES9 带来的新特性：for...await...of 循环

ES9 带来了一个新的特性：for...await...of 循环。这个特性可以极大地改善我们在异步编程时使用迭代器的体验。在这篇文章中，我们将会详细讲解这个特性，并提供示例代码。

for...await...of 循环的定义

在 ES9 中，for...await...of 循环是一个新的异步迭代器循环方法。它可以循环所有异步可迭代对象中的值，并且按照它们被解决的顺序进行规定。

与普通的 for...of 循环不同，for...await...of 循环的值必须是一个异步迭代器，并且必须返回一个 Promise，这个 Promise 会在值被解决时完成。

for...await...of 循环的使用方法

现在，我们将使用一个例子来展示如何在代码中使用 for...await...of 循环。我们将使用一个异步生成器，在每一次循环中，它会返回一个承诺，该承诺会在 1 秒后解决并返回一个数字。

// javascriptcn.com 代码示例
async function* generateNumbers() {
  let index = 0;
  while (index < 5) {
    await new Promise(resolve => setTimeout(resolve, 1000));
    yield index++;
  }
}

(async () => {
  for await (let num of generateNumbers()) {
    console.log(num);
  }
})();

在这段代码中，我们定义了一个异步生成器，它会返回一个数字。每次迭代时，我们会等待 1 秒钟，以模拟异步操作。最后，我们使用 for...await...of 循环来循环所有数字，并使用 console.log 打印出来。

for...await...of 循环的优势

for...await...of 循环可以极大地改善异步编程的体验。它可以让开发人员按顺序在异步可迭代对象上迭代，而不需要他们自己写复杂的异步代码。

此外，for...await...of 循环还可以使代码更加简洁易读。相比于手动处理 Promise，这个新特性可以让我们使用更简单的迭代器循环，并在每个值上等待一段时间。

总结

在本文中，我们了解了 ES9 的新特性 for...await...of 循环，并提供了如何在代码中使用它的示例。虽然异步编程可以非常复杂，但这个特性可以让我们的代码变得更加简洁易读。如果你正在进行异步编程，我们建议你尝试使用 for...await...of 循环，看看它是否可以提高您的开发效率。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65467fe57d4982a6eb08b126