在 JavaScript 中，迭代器是一种对象，它提供了一种遍历集合元素的方法。ES6 引入了 for...of 循环语句，它可以遍历迭代器生成的序列。ES9 引入了并行迭代器，它允许多个迭代器共同遍历一个集合，并返回所有迭代器的下一个元素。
并行迭代器的定义
ES9 并行迭代器是一个作为参数传递给 Symbol.asyncIterator() 方法的函数。此函数返回一个对象，这个对象有一个 next() 方法，用来返回 Promise 对象。next() 方法可以接收多个 Promise 对象的数组作为参数，如果所有 Promise 都 fulfilled 了，那么返回 Promise 对象的 value 属性是一个数组，它包含了所有 Promise 返回的值。
下面是一个示例：
-- -------------------- ---- -------
----- ---------- - -
------------------------ -
----- ----- - -------------------- ------------------- --------------------
--- --- - --
------ -
------ -
-- ---- - ------------- -
------ - ------ ------------- ----- ----- --
- ---- -
------ - ----- ---- --
-
-
--
-
--
------ -- -- -
----- --- -- -- - -----------
----------------- -- ----- -- ----- ---
------------ -- ---------------------我们在 asyncArray 上通过 Symbol.asyncIterator() 方法声明了一个异步迭代器。这个迭代器返回了一个 next() 函数，这个函数返回的是一个包含 value 和 done 属性的对象。
接着我们使用了 async/await 方法，来获取迭代器返回的 Promise 对象。我们从 asyncArray 中解构出了 a、b、c 三个变量，然后使用 await 关键字来获取这三个 Promise 对象。console.log 输出了 1、2、3。
并行迭代器的作用
并行迭代器的作用非常明确，就是让多个异步任务同时运行，然后在所有任务完成后，一次性地获取它们的结果。这种技术可以提高程序的执行效率，同时也可以让程序更加可读。
例如，我们可以使用并行迭代器来获取多个网页的内容，如下所示：
-- -------------------- ---- -------
----- ---- - -
-----------------------------------------------
-----------------------------------------------
----------------------------------------------
--
------ -- -- -
----- -------- - ------------ -- ------------
----- --------- - ----------------------
--- ----- ------ -------- -- ---------- -
----- ---- - ----- ----------------
------------------
-
------------ -- ---------------------在这个例子中，我们使用了 fetch() 方法来获取多个网页的内容。我们把每个 fetch() 方法返回的 Promise 对象放到一个数组里面，然后使用 Promise.all() 方法来等待所有 Promise 都 fulfilled。
接着，我们在 for...of 循环体中遍历 responses 迭代器返回的内容，这个内容就是整个数组的结果。然后我们可以使用 await 关键字来获取 response 对象的 json 数据，最后输出这个数据。
并行迭代器的指导意义
并行迭代器是一种非常实用的 JavaScript 技术，它可以让我们更加方便地管理多个异步任务。在现代 Web 应用中，异步任务变得越来越普遍，我们需要一种方法来组织这些异步任务。
同时，了解并行迭代器和它的使用方法，可以帮助我们更好地理解异步任务的本质，以及如何应对复杂的异步代码。
结论
ES9 并行迭代器是 JavaScript 中的一个非常实用的技术，它可以让我们更好地组织多个异步任务，并提高程序的执行效率。通过了解这个技术，我们可以更好地理解异步任务的本质，以及如何编写更加优雅的异步代码。
示例代码：https://codepen.io/janetchen/pen/gOWNXbp
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6709f053d91dce0dc87d29e5