生成器函数通过function*定义，返回迭代器对象，调用next()可逐次执行并返回value和done属性，适用于异步编程、自定义迭代器等场景。
JS的生成器函数是一种特殊的函数，它允许你暂停函数的执行，并在稍后的某个时间点恢复执行。简单来说，它像一个可以多次返回值的函数。
生成器函数可以让你更灵活地处理异步操作、迭代器等场景。
生成器函数是如何工作的？
生成器函数使用
function*语法定义。与普通函数不同，生成器函数在调用时不会立即执行，而是返回一个迭代器对象。这个迭代器对象可以控制生成器函数的执行。
生成器函数内部可以使用
yield关键字来暂停函数的执行，并将
yield后面的表达式的值作为迭代器的
value属性返回。当调用迭代器的
next()方法时，生成器函数会从上次暂停的地方继续执行，直到遇到下一个
yield关键字或者函数结束。
如何定义和使用生成器函数？
function* myGenerator() {
yield 1;
yield 2;
yield 3;
}
const iterator = myGenerator();
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }可以看到，每次调用
iterator.next()，生成器函数都会执行到下一个
yield，并返回一个包含
value和
done属性的对象。
done属性表示生成器函数是否已经执行完毕。
生成器函数在异步编程中的应用
生成器函数可以用于简化异步编程。例如，可以使用生成器函数来实现一个简单的异步任务队列：
function* asyncTaskQueue(tasks) {
for (const task of tasks) {
const result = yield task(); // 假设 task 返回一个 Promise
console.log('Task completed:', result);
}
}
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
const tasks = [
() => delay(1000).then(() => 'Task 1'),
() => delay(500).then(() => 'Task 2'),
() => delay(1500).then(() => 'Task 3'),
];
const iterator = asyncTaskQueue(tasks);
function runTask(iterator, value) {
const result = iterator.next(value);
if (!result.done) {
result.value.then(res => runTask(iterator, res));
}
}
runTask(iterator);这个例子展示了如何使用生成器函数来顺序执行异步任务。虽然看起来比 Promise.all 复杂一些，但在处理复杂的异步流程控制时，生成器函数可以提供更清晰的结构。
生成器函数与迭代器的关系
生成器函数返回的是一个迭代器对象，这个迭代器对象实现了迭代器协议。迭代器协议定义了迭代器的行为，包括
next()方法。
迭代器协议的核心是
next()方法，它返回一个包含
value和
done属性的对象。
value属性表示迭代器的当前值，
done属性表示迭代器是否已经迭代完毕。
生成器函数可以自动实现迭代器协议，这使得它非常适合用于创建自定义的迭代器。
生成器函数的
yield*语法
yield*语法可以将另一个迭代器（或者可迭代对象）中的值依次 yield 出来。这可以用于组合多个生成器函数。
function* generator1() {
yield 1;
yield 2;
}
function* generator2() {
yield 3;
yield* generator1(); // yield* 用于委托给另一个生成器
yield 4;
}
const iterator = generator2();
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 4, done: false }
console.log(iterator.next()); // { value: undefined, done: true }yield*简化了组合多个迭代器的过程，使得代码更加简洁易懂。
技术上面应用了三层结构，AJAX框架，URL重写等基础的开发。并用了动软的代码生成器及数据访问类，加进了一些自己用到的小功能，算是整理了一些自己的操作类。系统设计上面说不出用什么模式，大体设计是后台分两级分类，设置好一级之后，再设置二级并选择栏目类型，如内容，列表，上传文件，新窗口等。这样就可以生成无限多个二级分类，也就是网站栏目。对于扩展性来说，如果有新的需求可以直接加一个栏目类型并新加功能操作
生成器函数的错误处理
在生成器函数中，可以使用
try...catch语句来捕获错误。如果
yield表达式抛出错误，可以在生成器函数内部捕获并处理它。
function* myGenerator() {
try {
yield 1;
throw new Error('Something went wrong');
yield 2; // 这行代码不会执行
} catch (error) {
console.error('Error caught:', error);
}
yield 3;
}
const iterator = myGenerator();
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // Error caught: Error: Something went wrong
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }错误处理对于保证生成器函数的健壮性非常重要。
生成器函数与async/await 的关系
async/await是 ES2017 中引入的用于简化异步编程的语法糖。实际上，
async/await的底层实现依赖于生成器函数。
async函数实际上是一个返回 Promise 的生成器函数的语法糖。
await关键字用于暂停
async函数的执行，直到 Promise resolve。
虽然
async/await比生成器函数更易于使用，但理解生成器函数有助于更好地理解
async/await的工作原理。
生成器函数的适用场景
生成器函数适用于以下场景：
- 异步编程：可以使用生成器函数来简化异步任务的流程控制。
- 迭代器：可以使用生成器函数来创建自定义的迭代器。
- 状态机：可以使用生成器函数来实现状态机。
- 惰性求值：可以使用生成器函数来实现惰性求值，只在需要时才计算值。
总之，生成器函数是一个强大的工具，可以用于解决各种编程问题。
生成器函数的性能考虑
虽然生成器函数很强大，但在使用时也需要考虑性能问题。生成器函数的执行效率通常比普通函数略低，因为它需要在每次
yield时保存和恢复执行状态。
因此，在对性能要求非常高的场景下，需要仔细评估是否适合使用生成器函数。
生成器函数的调试技巧
调试生成器函数可能会比较困难，因为它的执行流程比较复杂。可以使用以下技巧来调试生成器函数：
- 使用
console.log
语句来输出生成器函数的执行状态。 - 使用调试器来单步执行生成器函数。
- 使用
try...catch
语句来捕获错误。
熟练掌握这些调试技巧可以帮助你更好地理解和调试生成器函数。
