在 ECMAScript 2018 中，我们了解了 for...of 循环语句，它允许我们循环迭代一个可迭代对象的每一个元素。从 ECMAScript 2019 开始，我们也可以使用 for await...of 循环语句，来对一个异步迭代器进行循环迭代。在本文中，我们将会详细讨论如何正确使用 for await...of 循环语句，并给出一些实用的建议和示例代码。
for await...of 简介
for await...of 循环语句允许我们对一个异步迭代器进行循环迭代。异步迭代器是一种新的迭代器类型，它允许我们以异步的方式迭代一个可迭代对象。异步迭代器是由一个 asynchronous next() 方法和一个 Symbol.asyncIterator 属性组成的对象。当我们调用 asynchronous next() 方法时，它会返回一个 Promise，该 Promise 会在下一个元素准备好之后 resolve。
for await...of 循环语句的语法如下：
--- ----- --------- -- ------- - -- ---------- -
其中，variable 是一个变量，它用来保存迭代器的每一个元素。object 是一个异步可迭代对象，它可以是一个数组、一个字符串等等。
for await...of 的用途
for await...of 循环语句可以用于循环迭代那些需要异步请求的元素，例如从远程服务器获取的数据或者从本地文件系统中读取的数据等等。使用 for await...of 循环语句可以让我们避免回调地狱和编写大量的异步代码。
如何正确使用 for await...of
下面是一些关于如何正确使用 for await...of 循环语句的实用建议：
1. 确保迭代器是异步迭代器
在使用 for await...of 循环语句之前，我们需要确保所迭代的对象是异步迭代器。如果不是异步迭代器，我们可以通过将它转换为一个异步迭代器的方式来实现：
----- ------------- - ---------------------- -- ----------- ----- ------------- - -------------------------------------- -- ----------------
2. 确保迭代器返回的是 Promise
异步迭代器的 asynchronous next() 方法必须返回一个 Promise。我们可以通过使用 async/await 语法来调用 asynchronous next() 方法，这样可以让我们更方便地处理异步结果：
----- -------- --------- -
----- ------------- - ----------------------
----- ------------- - --------------------------------------
--- ----- ------ ---- -- -------------- -
------------------
-
-3. 处理 Promise 的 reject
在异步代码中，我们需要时刻注意错误处理。当我们使用 for await...of 循环语句处理异步迭代器时，我们需要始终确保对 asynchronous next() 方法返回的 Promise 进行错误处理。在实际开发中，我们可以使用 try/catch 语句来捕获错误并进行相应的处理。
----- -------- --------- -
----- ------------- - ----------------------
----- ------------- - --------------------------------------
--- -
--- ----- ------ ---- -- -------------- -
------------------
-
- ----- ----- -
-------------------
-
-示例代码
下面是一些示例代码，演示了如何使用 for await...of 循环语句：
示例代码一：从远程服务器获取数据
----- -------- ----------- -
----- --- - --------------------------------
----- -------- - ----- -----------
----- ------------ - ----- ----------------
------ -------------
-
----- -------- --------- -
----- ---- - ----- ------------
----- ------------- - ----------------------------------- -- --------
--- ----- ------ ---- -- -------------- -
------------------
-
-示例代码二：从本地文件系统读取数据
----- -- - --------------
----- -------- -------------- -
------ --- ----------------- ------- -- -
----------------- ----- ----- -- -
-- ----- -
------------
- ---- -
--------------
-
---
---
-
----- -------- --------- -
----- ---- - ----- ------------------------------
----- ----- - ----------------------------
----- ------------- - ------------------------------ -- --------
--- ----- ------ ---- -- -------------- -
------------------
-
-结论
for await...of 循环语句提供了一种方便的方式来遍历异步迭代器，它使得我们可以更轻松地处理异步数据。在使用 for await...of 循环语句时，我们需要确保所迭代的对象是异步迭代器，并始终对 asynchronous next() 方法返回的 Promise 进行正确的错误处理。我们可以使用异步函数和 Promise 来处理异步结果，这样可以让我们更方便地编写异步代码。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/671b07dc9babaf620fa70208