深度解析 ES6 中的 Generator，轻松掌控异步编程

2023-10-02 10:18:06

ES6 中的 Generator

ES6 引入的 Generator 是一种用于处理异步操作的强大工具。它允许您在代码中创建可暂停和恢复的函数，从而可以更加轻松地处理异步任务。Generator 的工作原理类似于 Promise，但它提供了更灵活和细粒度的控制。

Generator 函数使用function*声明，后面紧跟着一个函数名和一对括号。函数体内部使用yield关键字来暂停函数的执行，并将控制权交还给调用者。当调用者准备继续执行函数时，它会使用next()方法来恢复函数的执行。

function* generatorFunction() {
  const result1 = yield 1;
  const result2 = yield 2;
  return result1 + result2;
}

const generator = generatorFunction();
const result1 = generator.next(); // { value: 1, done: false }
const result2 = generator.next(3); // { value: 5, done: true }

在上面的示例中，当您调用generator.next()时，它会暂停函数的执行并返回一个对象。该对象包含两个属性：value和done。value属性包含当前yield表达式的结果，而done属性指示函数是否已完成执行。当done属性为true时，表示函数已完成执行，并且没有更多的yield表达式要执行了。

Generator 和 Promise 的比较

Generator 和 Promise 都是 ES6 中用于处理异步操作的工具，但它们之间存在一些关键差异。

暂停和恢复执行： Generator 函数可以暂停和恢复执行，而 Promise 只能执行一次。这使得 Generator 非常适合处理需要多次暂停和恢复执行的异步操作。
控制权： 在 Generator 函数中，您可以使用yield关键字来控制函数的执行流程，而在 Promise 中，您只能等待 Promise 完成或失败。这使得 Generator 更加灵活和细粒度。
语法： Generator 函数的语法比 Promise 更复杂，但它提供了更多的控制权和灵活性。