如何在 ECMAScript 2018 中使用 for await 循环处理异步操作

在现代的 Web 开发中,异步操作是无法避免的。JavaScript 语言本身是单线程的,而异步操作可以使得程序在等待 I/O 或网络请求时不会被阻塞,从而提高程序的性能。在 ECMAScript 2018 中,新加入了一个 for await 循环语法,可以方便地处理异步操作。本文将介绍如何使用 for await 循环来处理异步操作。

for await 循环语法

for await 循环是 for...of 循环的异步版本。它可以遍历异步可迭代对象(async iterable),并且可以在每次迭代中等待 Promise 的解决。for await 循环的语法如下:

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

其中,asyncIterable 是一个异步可迭代对象,item 是每次迭代的值。在每次迭代中,for await 循环会等待 Promise 的解决,然后将解决后的值赋给 item。

异步可迭代对象

异步可迭代对象是一个具有 Symbol.asyncIterator 方法的对象。Symbol.asyncIterator 方法返回一个异步迭代器(async iterator),它具有 next 方法,用于异步地返回下一个值。异步迭代器的 next 方法返回一个 Promise,该 Promise 在异步迭代器解决下一个值时解决。

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

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

该异步可迭代对象会异步地返回数字 0、1、2,每个数字之间间隔 100 毫秒。

使用 for await 循环处理异步操作

使用 for await 循环处理异步操作非常方便。下面是一个使用 for await 循环处理异步可迭代对象的示例:

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

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

-------

该示例会输出数字 0、1、2,每个数字之间间隔 100 毫秒。

总结

使用 for await 循环处理异步操作可以方便地遍历异步可迭代对象,并且可以在每次迭代中等待 Promise 的解决。异步可迭代对象是具有 Symbol.asyncIterator 方法的对象,该方法返回一个异步迭代器,用于异步地返回下一个值。在处理异步操作时,我们可以使用 for await 循环来简化代码,提高程序的可读性和性能。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65c84861add4f0e0ff221a30