异步生成器是通过 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();
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');
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 异步编程的重要补充。合理使用能显著提升代码的可维护性和表达力。










