在 JavaScript 中,for-of
循环是我们经常使用的语句之一。它可以迭代一个可迭代对象(Iterable Object),例如 Array、Map、Set、TypedArray、String 等等。然而,在处理大量数据或者数据来源是异步请求的情况下,for-of
循环的效率可能会较低。这时我们可以使用 ES9 中新增的异步迭代器(Async Iterator)来提高 for-of
循环的效率。
异步迭代器是什么?
异步迭代器是一个包含 next()
方法并且返回一个 Promise
的对象。它用来在异步情况下处理大量数据,每次迭代时都会返回一个表示异步操作的 Promise
对象。
异步迭代器的结构可以看作下面这样:
-- ----- ----- ------------- - - ------------------------ - ------ - -- -- ------ - ----- ----- - ------------------ -- ---- ----- ---- - - -- ----------- ------ ----------------------- ------- - -- - --
在上面的例子中,我们使用了一个数组 arr
作为数据来源,然后每次调用 next()
方法都会执行一个异步操作 asyncOperation
。当数据迭代结束时,返回的 Promise
对象将会带着 {done: true}
。
在 for-of 循环中使用异步迭代器
使用异步迭代器,我们可以改进 for-of
循环的效率。下面是一个简单的示例:
----- -------- --------- - ----- ------------- - ------------------------- ------ --- ----- ------ - -- -------------- - --------------- - -
在上面的例子中,iterate()
函数的执行过程如下:
- 调用
createAsyncIterable()
,创建一个包含两个字符的数组的异步迭代器。 - 在
for-await-of
循环中,每次迭代都会由asyncIterable
对象返回一个Promise
对象,表示异步操作的值和状态。 - 当异步操作执行完毕后,
Promise
对象的值会返回给for-await-of
循环的变量x
。
示例代码
下面是一段更完整的示例代码,它用一个异步迭代器来从服务器获取数据:
----- -------- - ------------------------------- ----- -------- ------------------- - ----- ---- - --- ----- -------- - ----- ---------------- ----- ------ - -------------------------- ----- ------ - ----- ------ ------ - ----- -------------- -- ------ ------ ----------------- - ------ --- ------------------------ - -- --------- ----- -------- ------------------------- - ----- ---- - ----- -------------------- ----- -------- - --- --------------- --- ---------- - -- ------ - ----- ------ - -- ----------- -- ---------------- ------ ------ ------ ----- ----- - ------------------------------ ---------- -- -- ------ ------- ----- ------- - -- - -- ----------- ----- -------- ------------- - ----- ----------------- - ----- -------------------------- --- ----- ------ ---- -- ------------------ - ------------------ - -
在上面的代码中,我们通过异步请求从服务器获取了一些二进制数据。在 createAsyncDataIterable()
函数中,我们将这些数据包装成了一个异步迭代器。然后我们使用 for-await-of
循环来迭代数据,并将读取到的每一项输出到控制台中。
结论
ES9 中新增的异步迭代器可以提高 for-of
循环处理大量数据或者异步请求的效率。我们可以根据不同的需求来定制异步迭代器的逻辑,从服务器获取数据、将数据分批加载等等操作都可以在异步迭代器中完成。这有助于我们更好地处理大量的异步数据,并带来更好的开发体验。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/6738a226317fbffedf11c9b9