ES9 中的异步迭代器-JavaScript中文网-JavaScript教程资源分享门户

在 ES9 中，新增了异步迭代器（Async Iterator）的功能，它可以为异步操作提供一个更加方便的遍历机制。在本文中，我们将深入探讨 ES9 中的异步迭代器，包括它的定义、使用方法以及示例代码，帮助你更好地掌握这一技术。

异步迭代器定义

异步迭代器与同步迭代器（即 Iterator）有点不同，它的特点在于：每次执行 next 方法时，返回的是一个 Promise 对象。通过 await 关键字等待 Promise 对象的解决结果，就可以得到异步操作的结果。

具体来说，一个异步迭代器必须实现 Symbol.asyncIterator 方法。该方法返回一个包含 next 方法的迭代器对象，每次调用 next 方法会返回一个 Promise 对象，该 Promise 对象的 resolve 函数的参数是一个形如 { value: any, done: boolean } 的对象。

使用方法

下面我们来看一下如何在代码中使用异步迭代器。

在for-await-of循环中使用

// javascriptcn.com 代码示例
async function forAsync() {
  const asyncIterable = {
    [Symbol.asyncIterator]() {
      const arr = [Promise.resolve(1), Promise.resolve(2), Promise.resolve(3)];
      let index = 0;
      return {
        async next() {
          if (index >= arr.length) {
            return { done: true };
          }
          return { value: await arr[index++], done: false };
        },
      };
    },
  };
  for await (const item of asyncIterable) {
    console.log(item);
  }
}

可以看到，我们在 asyncIterable 对象中实现 Symbol.asyncIterator 方法，返回一个迭代器对象。在迭代器对象中，实现了 next 方法，每次返回的都是一个 Promise 对象。

接下来，我们使用 for-await-of 循环遍历异步迭代器，await 表示需要等待 Promise 对象的解决结果。通过这种方式，就可以实现对异步操作的遍历。

在其他方法中使用

除了 for-await-of 循环外，还可以通过调用迭代器对象的 next 方法来实现异步操作的遍历。

// javascriptcn.com 代码示例
async function nextAsync() {
  const asyncIterable = {
    [Symbol.asyncIterator]() {
      const arr = [Promise.resolve(1), Promise.resolve(2), Promise.resolve(3)];
      let index = 0;
      return {
        async next() {
          if (index >= arr.length) {
            return { done: true };
          }
          return { value: await arr[index++], done: false };
        },
      };
    },
  };
  const asyncIterator = asyncIterable[Symbol.asyncIterator]();
  let result = await asyncIterator.next();
  while (!result.done) {
    console.log(result.value);
    result = await asyncIterator.next();
  }
}

在上面的示例代码中，我们首先获取迭代器对象 asyncIterator，然后通过 await 关键字来等待每次 next 方法的执行结果。当 done 属性为 true 的时候，说明遍历完成。

示例代码

最后，我们来看一个完整的示例代码：

// javascriptcn.com 代码示例
async function asyncExample() {
  const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
  const asyncIterable = {
    [Symbol.asyncIterator]() {
      const arr = [delay(1000).then(() => 1), delay(2000).then(() => 2), delay(3000).then(() => 3)];
      let index = 0;
      return {
        async next() {
          if (index >= arr.length) {
            return { done: true };
          }
          return { value: await arr[index++], done: false };
        },
      };
    },
  };
  for await (const item of asyncIterable) {
    console.log(item);
  }
}
asyncExample();

在上面的示例代码中，我们通过 delay 函数来模拟异步操作，每个 Promise 都有不同的延迟时间。使用异步迭代器来遍历这些异步操作的结果，可以看到输出结果为：1、2、3，符合预期。

总结

通过本文的讲解，我们了解了 ES9 中的异步迭代器，包括它的定义、使用方法以及示例代码。通过使用异步迭代器，可以更加方便地遍历异步操作的结果，提高代码的效率。希望本文对你有所帮助，谢谢阅读！

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65312c1b7d4982a6eb2c7d81