异步迭代器适合处理流数据，因其按需获取异步值，避免内存堆积。通过Symbol.asyncIterator返回Promise解析为{value, done}的对象，可使用for await...of消费。例如模拟延迟生成数据、读取Fetch响应流或分页API时，能实时处理每块数据，提升效率与响应性。
JavaScript中的异步迭代器适合处理流数据，因为它们允许你按需获取和处理异步产生的值，而不是等待所有数据一次性到达。这在处理网络流、文件读取或大量分页数据时特别有用。
异步迭代器的基本结构
异步迭代器遵循异步迭代协议，其Symbol.asyncIterator方法返回一个对象，该对象的next()方法返回Promise，Promise解析为{ value, done }格式的对象。
定义一个简单的异步迭代器：
async function* createDataStream() {
const data = ['first', 'second', 'third'];
for (const item of data) {
await new Promise(resolve => setTimeout(resolve, 1000)); // 模拟异步延迟
yield item;
}
}
使用for await...of循环消费这个流：
立即学习“Java免费学习笔记（深入）”；
(async () => {
for await (const chunk of createDataStream()) {
console.log(chunk); // 每隔1秒输出一个值
}
})();
处理真实流数据（如Fetch响应）
现代浏览器中，fetch()返回的Response对象的body是一个可读流（ReadableStream），它天然支持异步迭代。
你可以直接用for await...of读取流中的数据块：
async function readStream(url) {
const response = await fetch(url);
const reader = response.body.getReader();
<p>// 流支持异步迭代
while (true) {
const { done, value } = await reader.read();
if (done) break;
console.log('Received chunk:', value);
// 处理二进制数据（Uint8Array）
const text = new TextDecoder().decode(value);
console.log('Text:', text);
}
}</p>或者更简洁地封装为异步生成器：
async function* streamAsyncIterator(stream) {
const reader = stream.getReader();
try {
while (true) {
const { done, value } = await reader.read();
if (done) return;
yield value;
}
} finally {
reader.releaseLock();
}
}
结合实际场景：分页API模拟流式处理
当从后端获取分页数据时，可以将每一页视为流中的一个“块”：
async function* paginatedData(url) {
let page = 1;
while (true) {
const response = await fetch(`${url}?page=${page}`);
const data = await response.json();
if (data.length === 0) break;
yield data; // 返回当前页数据
page++;
}
}
<p>// 使用
(async () => {
for await (const page of paginatedData('/api/items')) {
console.log('Processing page with', page.length, 'items');
// 可以实时处理每页数据，无需等待全部加载
}
})();</p>基本上就这些。异步迭代器让流式数据处理变得更自然、内存更友好，尤其适合大数据量或实时性要求高的场景。不复杂但容易忽略。
