手写Generator自执行器(基于Promise)

2023-10-18 00:49:13

前言

Generator是ES6推出的新的语法。它通过协程实现，具有执行时暂停并交出执行权，之后又从暂停处恢复执行的特性。这使得Generator可以用于处理异步逻辑。但Generator本身并没有自执行功能，所以通常会搭配类似于co这种执行器一起使用。

Generator

Generator函数是一个特殊的函数，它可以暂停执行，并在稍后继续执行。Generator函数使用yield来实现暂停和恢复执行。

一个简单的Generator函数如下：

function* generatorFunction() {
  yield 1;
  yield 2;
  yield 3;
}

当调用generatorFunction()函数时，它不会立即执行。相反，它会返回一个Generator对象。Generator对象是一个迭代器，可以逐个生成值。

要从Generator对象获取值，可以使用next()方法。next()方法会执行Generator函数直到遇到yield关键字，然后返回一个包含yield表达式的值的对象。

例如，以下代码使用next()方法从generatorFunction()函数获取值：

const generator = generatorFunction();
console.log(generator.next()); // { value: 1, done: false }
console.log(generator.next()); // { value: 2, done: false }
console.log(generator.next()); // { value: 3, done: false }
console.log(generator.next()); // { value: undefined, done: true }

自执行器

自执行器是一种可以自动执行Generator函数的函数。自执行器通常使用Promise来实现。

一个简单的自执行器如下：

function autoExec(generatorFunction) {
  const generator = generatorFunction();

  function handleNext(result) {
    if (result.done) {
      return Promise.resolve(result.value);
    }

    return Promise.resolve(result.value).then(handleNext);
  }

  return handleNext(generator.next());
}

autoExec()函数接受一个Generator函数作为参数，并返回一个Promise。Promise会自动执行Generator函数，并在Generator函数执行完成后resolve。

要使用autoExec()函数，可以如下所示：

autoExec(generatorFunction()).then(result => {
  console.log(result); // 3
});

手写Generator自执行器

现在我们已经了解了Generator和自执行器的基本原理，接下来我们就可以手写一个Generator自执行器了。

手写Generator自执行器的步骤如下：

创建一个Generator函数。
创建一个自执行器函数。
在自执行器函数中，使用Promise来执行Generator函数。
返回Promise。

以下是如何手写Generator自执行器的代码：

function autoExec(generatorFunction) {
  return new Promise((resolve, reject) => {
    const generator = generatorFunction();

    function handleNext(result) {
      if (result.done) {
        resolve(result.value);
        return;
      }

      Promise.resolve(result.value).then(handleNext).catch(reject);
    }

    handleNext(generator.next());
  });
}