原文《Async Generator Functions in JavaScript》
翻译：范小饭
将for/await/of引入javascript的TC39异步迭代器提议还引入了异步生成器函数的概念。现在，javascript有6种不同的函数类型。
- 普通函数
function() {} - 箭头函数
() => {} -
异步函数
async function() {} - 异步箭头函数
async () => {} - 生成器函数
function*() {} - 异步生成器函数
async function*() {}
异步生成器函数是特别的，因为你可以在函数中同时使用await 和 yield， 异步生成器函数不同于异步函数和生成器函数，因为它不会返回promise或者iterator，而是返回异步迭代器，你可以把异步迭代器作为一个next（）函数总是返回一个promise的迭代器。
你的第一个异步迭代器
异步迭代器函数行为与迭代器函数相似，迭代器函数返回一个有next函数的对象，调用next（）将执行generator函数，直到下一个yield。不同的是，异步迭代器的next() 返回一个promise
下面是一个异步生成器函数的"Hello, World"的例子。请注意，下面的脚本在10.x之前的node.js版本上不起作用。
'use strict';
async function* run() {
await new Promise(resolve => setTimeout(resolve, 100));
yield 'Hello';
console.log('World');
}
// `run()` returns an async iterator.
const asyncIterator = run();
// The function doesn't start running until you call `next()`
asyncIterator.next().
then(obj => console.log(obj.value)). // Prints "Hello"
then(() => asyncIterator.next()); // Prints "World"
最干净的方法是使用for/await/of循环整个异步生成器函数。
'use strict';
async function* run() {
await new Promise(resolve => setTimeout(resolve, 100));
yield 'Hello';
console.log('World');
}
const asyncIterator = run();
// Prints "Hello\nWorld"
(async () => {
for await (const val of asyncIterator) {
console.log(val); // Prints "Hello"
}
})();
一个实际的用例
你可能在想，为什么有了异步函数和生成器函数，JavaScript还需要异步生成器函数？一个用例是RyanDahl最初编写node.js来解决的经典进度条问题。
假设您希望遍历Mongoose光标中的所有文档，并通过WebSocket或命令行报告进度。
'use strict';
const mongoose = require('mongoose');
async function* run() {
await mongoose.connect('mongodb://localhost:27017/test', { useNewUrlParser: true });
await mongoose.connection.dropDatabase();
const Model = mongoose.model('Test', mongoose.Schema({ name: String }));
for (let i = 0; i < 5; ++i) {
await Model.create({ name: `doc ${i}` });
}
// Suppose you have a lot of documents and you want to report when you process
// each one. You can `yield` after processing each individual doc.
const total = 5;
const cursor = Model.find().cursor();
let processed = 0;
for await (const doc of cursor) {
// You can think of `yield` as reporting "I'm done with one unit of work"
yield { processed: ++processed, total };
}
}
(async () => {
for await (const val of run()) {
// Prints "1 / 5", "2 / 5", "3 / 5", etc.
console.log(`${val.processed} / ${val.total}`);
}
})();
异步生成器函数使您的异步函数能够以无框架的方式报告其进度，不需要明确的创建websocket或者console.log，假设业务逻辑使用yield进行进度报告，你可以使用yield单独处理。
可以观测的
异步迭代器很棒，但还有另一个并发原语，即异步生成器函数与RxJS observables也能很好的对应上。
'use strict';
const { Observable } = require('rxjs');
const mongoose = require('mongoose');
async function* run() {
// Same as before
}
// Create an observable that emits each value the async generator yields
// to subscribers.
const observable = Observable.create(async (observer) => {
for await (const val of run()) {
observer.next(val);
}
});
// Prints "1 / 5", "2 / 5", "3 / 5", etc.
observable.subscribe(val => console.log(`${val.processed} / ${val.total}`));
RxJS observable和异步迭代器有2个关键区别，
1、在上面的示例中，在subscribe（）中记录到控制台的代码是反应式的，而不是命令式的。换句话说，subscribe（）处理程序无法影响异步函数体中的代码，它只对事件作出反应，当用一个for/await/of 循环，例如，当使用for/await/of循环时，可以在恢复异步生成器函数之前添加一秒钟的暂停
(async () => {
for await (const val of run()) {
// Prints "1 / 5", "2 / 5", "3 / 5", etc.
console.log(`${val.processed} / ${val.total}`);
// This adds a 1 second delay to every `yield` statement.
await new Promise(resolve => setTimeout(resolve, 1000));
}
})();
第二个就是，由于RXJS observable在默认情况下是冷的，所以一个新的subscribe（）调用会重新执行该函数。
// Prints "1 / 5", "2 / 5", "3 / 5", etc.
observable.subscribe(val => console.log(`${val.processed} / ${val.total}`));
// Kicks off a separate instance of `run()`
observable.subscribe(val => console.log(`${val.processed} / ${val.total}`));
Moving On
异步生成器函数一开始可能看起来令人困惑，但它们提供了可能成为javascript的进度条问题的本机解决方案，使用yield报告异步函数的进度是一个诱人的想法，因为它允许您将业务逻辑与进度报告框架分离。下次需要实现进度条时，给异步生成器一个机会。
