从 Iterator、Generator、AsyncIterable 到 ES9 的 Asynchronous Iterators

阅读时长 7 分钟读完

前言

在前端开发中,我们经常需要处理异步操作。在处理异步操作时,我们需要用到迭代器(Iterator)、生成器(Generator)和异步可迭代对象(AsyncIterable)。在 ES9 中,还新增了异步迭代器(AsyncIterator)的概念。本文将会从 Iterator、Generator、AsyncIterable 到 ES9 的 Asynchronous Iterators 进行详细的介绍和学习,同时也会提供一些指导意义和示例代码。

迭代器(Iterator)

迭代器是一种可以遍历集合的对象。它提供了一种统一的访问集合中每个元素的方式,而无需暴露集合的内部结构。迭代器有两个方法:next()return()。其中,next() 方法会返回一个对象,该对象包含两个属性:valuedonevalue 属性表示当前迭代到的元素,而 done 属性表示迭代是否已经完成。当迭代完成后,next() 方法会返回一个 done 属性为 true 的对象。

下面是一个迭代器的示例代码:

-- -------------------- ---- -------
-------- ------------------- -
  --- ----- - --

  ------ -
    ------ -
      -- ------ - ----------- -
        ------ - ------ ------------- ----- ----- --
      - ---- -
        ------ - ------ ---------- ----- ---- --
      -
    --
    -------- -
      --------------------- --- ---- ----------
      ------ - ------ ---------- ----- ---- --
    -
  --
-

----- -------- - -------------------- ---- ------

----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---------- ----- ---- -
------------------------------- -- -------- --- ---- ------- - ------ ---------- ----- ---- -

生成器(Generator)

生成器是一种可以暂停和恢复执行的函数。生成器函数使用 function* 声明,它的执行过程可以被暂停和恢复,从而可以在函数的执行过程中生成多个值。生成器函数内部使用 yield 关键字来产生值,每次 yield 关键字会暂停函数的执行,并将产生的值返回给调用方。当再次调用生成器函数时,函数会从上次暂停的地方继续执行,直到函数执行结束或者遇到新的 yield 关键字。

下面是一个生成器的示例代码:

-- -------------------- ---- -------
--------- ----------------- -
  ----- ----
  ----- ----
  ----- ----
-

----- --------- - ------------------

------------------------------ -- - ------ ---- ----- ----- -
------------------------------ -- - ------ ---- ----- ----- -
------------------------------ -- - ------ ---- ----- ----- -
------------------------------ -- - ------ ---------- ----- ---- -

异步可迭代对象(AsyncIterable)

异步可迭代对象是一种可以异步遍历集合的对象。它提供了一种统一的访问集合中每个元素的方式,而无需暴露集合的内部结构。异步可迭代对象需要实现一个 Symbol.asyncIterator 方法,该方法会返回一个异步迭代器(AsyncIterator)。异步迭代器和迭代器的区别在于,异步迭代器的 next() 方法返回的是一个 Promise 对象,而不是一个对象。

下面是一个异步可迭代对象的示例代码:

-- -------------------- ---- -------
----- --------- ------------------------ -
  --- ---- - - -- - - ----------- ---- -
    ----- --- --------------- -- ------------------- -------
    ----- -------
  -
-

----- ------------- - ------------------------- ---- ------

------ ---------- -
  --- ----- ------ ----- -- -------------- -
    -------------------
  -
-----

异步迭代器(AsyncIterator)

异步迭代器是一种可以异步遍历集合的迭代器。它需要实现一个 next() 方法,该方法返回一个 Promise 对象,该 Promise 对象会在异步操作完成后返回一个对象,该对象包含两个属性:valuedonevalue 属性表示当前迭代到的元素,而 done 属性表示迭代是否已经完成。当迭代完成后,next() 方法会返回一个 done 属性为 true 的对象。

下面是一个异步迭代器的示例代码:

-- -------------------- ---- -------
----- ----- - -- -- --- --------------- -- ------------------- -----

----- --------- ------------------------ -
  --- ---- - - -- - - ----------- ---- -
    ----- ------------
    ----- -------
  -
-

----- ------------- - ------------------------- ---- ------

------ ---------- -
  ----------------- ---------------------- -- - ------ ---- ----- ----- -
  ----------------- ---------------------- -- - ------ ---- ----- ----- -
  ----------------- ---------------------- -- - ------ ---- ----- ----- -
  ----------------- ---------------------- -- - ------ ---------- ----- ---- -
-----

ES9 的 Asynchronous Iterators

在 ES9 中,新增了异步迭代器(AsyncIterator)的概念,它是一种可以异步遍历集合的迭代器。ES9 中为异步迭代器新增了一个 Symbol.asyncIterator 方法,该方法会返回一个异步迭代器(AsyncIterator)。同时,ES9 中也为 for await...of 循环语句新增了支持,可以用来异步遍历异步可迭代对象(AsyncIterable)。

下面是一个 ES9 的 Asynchronous Iterators 的示例代码:

-- -------------------- ---- -------
----- ----- - -- -- --- --------------- -- ------------------- -----

----- ------------- - -
  ----- ------------------------- -
    ----- ----
    ----- ------------
    ----- ----
    ----- ------------
    ----- ----
  -
--

------ ---------- -
  --- ----- ------ ----- -- -------------- -
    -------------------
  -
-----

总结

本文从 Iterator、Generator、AsyncIterable 到 ES9 的 Asynchronous Iterators 进行了详细的介绍和学习,并提供了一些指导意义和示例代码。希望本文能够帮助读者更好地理解和应用这些概念,在实际开发中更加得心应手。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6632e918d3423812e4076baf

纠错
反馈