异步生成器是结合async/await与生成器的函数，通过async function*定义，返回可异步遍历的迭代器。它适合处理分页请求，如逐页获取API数据，使用for await...of按需消费每页结果，避免内存过高。示例中封装了分页逻辑，每次yield返回一页数据，根据响应判断是否继续请求。优势包括内存友好、逻辑清晰、可中断和流式处理，适用于大量分页数据场景。注意需设置终止条件、处理错误并确认环境兼容性。异步生成器让分页像遍历数组一样自然，兼具异步非阻塞特性，是处理分页数据的优雅方案。
异步生成器在JavaScript中非常适合处理分页请求，因为它能以同步写法实现异步数据的逐步获取，特别适合处理大量分页数据时避免内存占用过高。
什么是异步生成器？
异步生成器是结合了 async/await 和 生成器函数 特性的函数，定义方式是在 function* 前加上 async。它返回一个异步迭代器，可以用 for await...of 遍历。
示例定义：
async function* fetchPages(url) {
let page = 1;
while (true) {
const response = await fetch(`${url}?page=${page}`);
const data = await response.json();
if (data.results.length === 0) break;
yield data.results;
page++;
}
}
如何用于分页请求？
在处理API分页（如GitHub、微博、商品列表等）时，通常需要逐页拉取直到没有更多数据。异步生成器可以封装这个过程，让调用方按需消费每一页。
立即学习“Java免费学习笔记（深入）”；
常见使用方式：
- 每次
yield返回一页结果 - 根据响应判断是否继续请求下一页
- 外部使用
for await...of按需处理每批数据
实际请求示例：
async function* getUserPosts() {
let page = 1;
const limit = 10;
while (true) {
const res = await fetch(`/api/posts?page=${page}&limit=${limit}`);
const { data, hasMore } = await res.json();
if (data.length === 0) break;
yield data;
if (!hasMore) break;
page++;
}
}
<p>// 使用：逐页处理，不一次性加载所有数据
for await (const posts of getUserPosts()) {
console.log('拿到一页:', posts.length, '条');
// 可用于渲染、存储或进一步处理
}
优势与适用场景
相比一次性获取所有页或手动管理翻页逻辑，异步生成器更清晰且资源友好。
- 内存友好：只在需要时拉取下一页
- 逻辑清晰：生成器内部封装翻页逻辑，外部只需遍历
- 可中断：可在任意页停止遍历，不会继续请求
- 支持流式处理：适合导出数据、实时展示等场景
注意事项
使用时注意以下几点：
- 确保有终止条件（如空数据、hasMore为false），避免无限请求
- 错误处理建议在生成器内部加 try/catch，或在遍历时捕获
- 某些环境需检查浏览器兼容性（现代Node.js和主流浏览器都支持）
基本上就这些。异步生成器让分页请求变得像遍历数组一样自然，同时保持异步非阻塞特性，是处理分页数据的一种优雅方式。
