在ES10中，新增了 for-await-of 语法，以便我们更方便地处理异步迭代器，这对于编写异步代码的前端程序员来说是一个非常好的消息。在本文中，我们将介绍如何使用 for-await-of 迭代异步生成器并提供详细的示例代码和指导建议。
什么是异步生成器？
在ES6中，引入了生成器函数，用于生成可迭代对象。生成器函数非常适合处理需要迭代的简单数据结构。在ES6中，生成器只能同步运行，生成器函数在第一次调用的时候，返回的是一个迭代器对象。通过这个迭代器对象，我们可以一次获取生成器函数的返回值。
在ES7中，Promise被引进ES6，让我们可以处理异步代码。为了对这两个feaeture做出优秀的结合，ES8中引入引入了异步生成器，使得我们可以使用类似于生成器函数的语法来编写异步代码。异步生成器返回的是一个异步迭代器对象，在第一次调用的时候不会立即返回一个值，而是返回一个 promise 对象，这个值会在异步调用完成之后返回。在ES10中，我们可以使用 for-await-of语法更方便地处理异步迭代器。
如何使用 for-await-of 迭代异步生成器？
假设我们有一个异步可迭代器，我们可以通过 Symbol.asyncIterator 来访问它的异步迭代器。接下来就可以使用 for-await-of 语法迭代异步迭代器了。
-- -------------------- ---- -------
----- --------- ---------------- -
--- - - --
----- -- - -- -
----- --- --------------- -- ------------------- -------
----- ----
-
-
------ ---------- -
--- ----- ---- --- -- ----------------- -
-----------------
-
-----在这个示例中，我们定义了一个名为 asyncGenerator 的异步生成器函数，该函数使用了 async 和 yield。在将 asyncGenerator 函数调用时，我们使用 for-await-of 语法遍历异步迭代器。在每次循环中， await 等待异步生成器 asyncGenerator 函数中的 promise 对象完成，这儿是使用 Promise 进行的简单延迟。
总结
在本文中，我们深入了解了 ES10 中如何使用 for-await-of 迭代异步生成器。使用迭代器和生成器的这个新语法，我们可以快速便捷地处理异步代码。for-await-of迭代器结合异步生成器，将会是未来前端领域一个非常有用的特性，可以提高我们的代码质量和开发效率，值得我们深入学习和掌握。希望能对前端开发的各位同学有所启发，提高大家的学习和代码水平。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65ba22a7add4f0e0ff2b2f19