在 ES9 中，新增了一个 for-await-of 循环，可以轻松地遍历异步生成器中的数据。但是，如果不注意并发限制，会导致性能问题和内存泄漏等问题。
for-await-of 循环
在 ES9 中，新增了一个 for-await-of 循环，可以遍历异步生成器中的数据。异步生成器是一种返回 Promise 对象的生成器，可以使用 async/await 语法来处理异步操作。
下面是一个简单的异步生成器示例：
-- -------------------- ---- -------
----- --------- ---------------- -
----- ----- -------------------
----- ----- -------------------
----- ----- -------------------
-
------ ---------- -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-----输出结果为：
1 2 3
并发限制
在使用 for-await-of 循环时，需要注意并发限制。如果不限制并发数，会导致性能问题和内存泄漏等问题。
下面是一个示例代码，使用 for-await-of 循环遍历异步生成器中的数据，并使用 Promise.all 来处理并发操作：
-- -------------------- ---- -------
----- -------- -------------------- -
----- --- --------------- -- ------------------- -------
-------------------
-
----- --------- ---------------- -
----- ----- -----------------
----- ----- -----------------
----- ----- -----------------
-
------ ---------- -
----- -------- - ---
--- ----- ------ ----- -- ----------------- -
---------------------
-
----- ----------------------
-----上面的代码中，asyncFunction 模拟了一个异步操作，使用 setTimeout 延迟了 1 秒钟。asyncGenerator 中使用 asyncFunction 返回 Promise 对象，for-await-of 循环遍历异步生成器中的数据，并将返回的 Promise 对象放入 promises 数组中。最后，使用 Promise.all 处理并发操作。
如果不限制并发数，会导致性能问题和内存泄漏等问题。下面是一个错误示例代码，没有限制并发数：
(async function() {
const promises = [];
for await (const value of asyncGenerator()) {
promises.push(asyncFunction(value));
}
await Promise.all(promises);
})();上面的代码中，没有限制并发数，会导致所有异步操作同时执行，可能会导致性能问题和内存泄漏等问题。
如何限制并发数
如何限制并发数呢？可以使用一个计数器来限制并发数，当计数器达到限制数时，等待当前操作完成后再执行下一个操作。下面是一个示例代码：
-- -------------------- ---- -------
----- -------- -------------------- -
----- --- --------------- -- ------------------- -------
-------------------
-
----- --------- ---------------- -
----- ----- -----------------
----- ----- -----------------
----- ----- -----------------
-
------ ---------- -
----- ----- - -- -- ------ -
----- -------- - ---
--- ----- - --
--- ----- ------ ----- -- ----------------- -
------------------------------------
--------
-- ------ -- ------ -
----- -----------------------
--------
-
-
----- ----------------------
-----上面的代码中，使用 limit 变量来限制并发数为 2。使用 count 变量来记录当前并发数，当 count 达到限制数时，使用 Promise.race 来等待当前操作完成后再执行下一个操作。最后，使用 Promise.all 处理所有操作。
总结
在 ES9 中，新增了一个 for-await-of 循环，可以遍历异步生成器中的数据。但是，如果不注意并发限制，会导致性能问题和内存泄漏等问题。可以使用一个计数器来限制并发数，当计数器达到限制数时，等待当前操作完成后再执行下一个操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6569b578d2f5e1655d244543