了解 ES9 并行迭代器

在 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