在 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