异步生成器是通过 async function* 定义的函数，返回可迭代的异步对象，支持在 yield 时返回 Promise，并用 for await...of 消费，适用于分页请求、流数据处理等场景，结合 await 和迭代逻辑，使异步流程更清晰易维护。
异步生成器（Async Generator）是 JavaScript 中处理异步数据流的有力工具，它结合了 async/await 和 Generator 的特性，适用于逐步获取异步数据的场景。比如从分页接口拉取数据、读取大型文件流或监听事件流时，使用异步生成器能让代码更清晰、可读性更强。
什么是异步生成器？
异步生成器函数通过 async function* 定义，调用后返回一个既支持异步操作又可迭代的对象。它可以在每次 yield 时返回一个 Promise，并在消费时自动等待结果。
与普通 Generator 不同，异步生成器产出的是 Promise，消费者通常使用 for await...of 来遍历。
基本语法和使用方式
定义一个异步生成器：
async function* fetchPaginatedData() {
let page = 1;
while (true) {
const response = await fetch(`/api/data?page=${page}`);
const data = await response.json();
<pre class='brush:php;toolbar:false;'>if (data.items.length === 0) break;
yield data.items; // 每次返回一页数据
page++;} }
使用 for await...of 遍历：
(async () => {
for await (const items of fetchPaginatedData()) {
console.log('Received items:', items);
}
})();
上面的例子中，每一页数据都会被异步加载并逐步处理，不会阻塞主线程，同时写法接近同步逻辑，易于理解和维护。
实际应用场景
异步生成器特别适合以下几种情况：
- 分页 API 调用：如上例所示，可以封装翻页逻辑，外部只需迭代即可获取所有数据。
- 流式数据处理：读取网络流、文件流或 WebSocket 消息时，逐段处理内容。
- 事件队列消费：将事件监听器包装成异步生成器，按顺序处理异步事件。
- 长时间轮询或心跳任务：定时请求服务端状态，每次 yield 返回最新结果。
错误处理与中断控制
异步生成器也支持 try...catch 和 return/break 控制流程。
async function* watchMessages() {
while (true) {
try {
const res = await fetch('/messages/next');
if (!res.ok) throw new Error('Failed to fetch');
<pre class='brush:php;toolbar:false;'> const msg = await res.json();
if (msg.type === 'end') return; // 主动结束
yield msg;
} catch (err) {
yield { error: true, message: err.message };
break;
}} }
在消费端也可以通过 break 提前退出循环：
for await (const msg of watchMessages()) {
if (msg.error) break;
console.log(msg);
}
基本上就这些。异步生成器让复杂异步流程变得更像同步迭代，结构清晰，逻辑集中，是现代 JS 异步编程的重要补充。合理使用能显著提升代码的可维护性和表达力。
