JavaScript - Symbol.asyncIterator 属性

Symbol.asyncIterator 属性用于在一个对象上定义异步迭代方法。它在 ECMAScript 2018 规范中引入，以启用 JavaScript 异步迭代协议。JavaScript 通常允许使用 for...of 循环进行同步迭代，该循环可以操作各种可迭代对象，包括集合、数组、字符串、映射等等。但是，当迭代需要异步操作（例如从服务器检索数据或从流中读取数据）时，同步迭代是不合适的。

为了克服这个问题，ECMAScript 引入了异步迭代器和 Symbol.asyncIterator 属性的概念。此内置符号使对象成为异步可迭代对象，从而启用异步迭代。

语法

以下是 JavaScript Symbol.asyncIterator 属性的语法：

[Symbol.asyncIterator]()

参数

此属性不接受任何参数。

返回值

此属性返回异步迭代器对象的返回值。

示例

示例 1

让我们来看下面的例子，我们将使用 for await of 循环来创建一个使用 symbol.asyncIterator 的异步可迭代对象。

<html>
   <body>
      <script>
         const x = {
            async *[Symbol.asyncIterator]() {
               yield 11 + " < br > ";
               yield 4 + " < br > ";
               yield 33 + " < br > ";
            }
         };
         (async () => {
            for await (const a of x) {
               document.write(a);
            }
         })();
      </script>
   </body>
</html>

如果我们执行上面的程序，它将在网页上显示数字。

示例 2

考虑另一种情况，我们将定义一个返回异步可迭代对象的异步生成器函数。

<html>
   <body>
      <script>
         async function* x() {
            yield 'Ram';
            yield 'Rahul';
            yield 'Ravi';
         }
         (async () => {
            for await (const a of x()) {
               document.write(a + " < br > ");
            }
         })();
      </script>
   </body>
</html>

执行上述脚本后，它将在网页上显示文本。

示例 3

在下面的示例中，我们将使用 Symbol.asyncIterator 创建一个自定义异步可迭代类，该类会生成值。

<html>
   <body>
      <script>
         class x {
            constructor() {
               this.a = [1, 2, 3];
            }
            async *[Symbol.asyncIterator]() {
               for (const y of this.a) {
                  await new Promise(resolve => setTimeout(resolve, 100));
                  yield y;
               }
            }
         }
         (async () => {
            for await (const b of new x()) {
               document.write(b + " < br > ");
            }
         })();
      </script>
   </body>
</html>

当我们执行脚本时，它将在网页上显示文本。

打印页面