在 JavaScript 中，generator 与 Promise 是两个非常重要的概念。虽然它们本身是独立的，但是结合使用可以让我们更加方便地处理异步代码，提高代码可读性和可维护性。
generator
Generator 函数是 ES6 中引入的一种新的函数类型，它通过 yield 关键字暂停函数执行状态，并且可以通过 next 方法恢复函数执行状态。
下面的示例代码展示了一个简单的 generator 函数：
function* generatorFunc() {
console.log('Start');
yield 1;
console.log('Middle');
yield 2;
console.log('End');
}当我们调用 generatorFunc 函数时，它并不会立即执行，而是返回一个迭代器。只有当调用迭代器的 next 方法时，才会开始执行函数，并在 yield 语句处停止执行，将当前执行状态保存在迭代器中。
我们可以通过多次调用 next 方法使函数继续执行，直到执行到最后一个 yield 语句或函数结束为止。每次调用 next 方法，都会将当前的值通过迭代器返回。如果继续调用 next 方法，将会得到一个 undefined 值。
const generator = generatorFunc();
console.log(generator.next()); // Start {value: 1, done: false}
console.log(generator.next()); // Middle {value: 2, done: false}
console.log(generator.next()); // End {value: undefined, done: true}在 generator 函数中， yield 关键字可以返回一个值，这个值可以通过 next 方法传递进来。我们可以将这个特性与 Promise 结合使用，实现异步函数的处理。
Promise
Promise 是一种处理异步操作的方法，它可以让我们更加直观地处理回调函数。简单的说，Promise 可以理解为一个容器，里面存放了未来可能完成的异步操作。
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
-------------------
-- ------
---
------------------- -- -
-------------------- -- -------
---在上面的示例代码中，我们通过 new Promise() 创建了一个 Promise 对象，并且传递了一个回调函数。这个回调函数接受两个参数： resolve 和 reject。在异步操作完成后，如果操作成功，我们调用 resolve 方法并将结果传递进去；如果失败，我们调用 reject 方法。
可以通过 then 方法获取异步操作的结果，如果操作成功，将返回一个包含成功结果的 Promise 对象；如果操作失败，将抛出一个包含错误信息的异常。
-- -------------------- ---- -------
----- ------- - --- ----------------- ------- -- -
------------- -- -
----------------
-- ------
---
------------------- -- -
------------------- -- -----
---在上面的示例代码中，我们使用了 catch 方法获取 Promise 的错误信息。
generator 与 Promise 结合
将 generator 和 Promise 结合使用，可以让我们更加方便地处理异步操作。下面的示例代码展示了如何使用 Promise 替换掉回调函数，并结合 generator 实现异步函数的处理。
-- -------------------- ---- -------
--------- ----------- -
--- -
----- ------ - ----- ---------------------------
--------------------
- ----- ------- -
-------------------
-
-
----- --------- - ------------
----- ---- - ---- -- -
----- ------ - ---------------------
-- ------------- -------
---------------------------------------- -- -
------------
-------------- -- -
-----------------------
---
--
-------在上面的示例代码中，我们定义了一个 asyncFunc 函数，并使用 generator 实现了函数的处理。在 generator 中，我们通过 yield Promise 将异步操作转化为了一个 Promise 对象。
在外部，我们定义了一个 next 函数，用于启动 generator 函数。通过调用 next 函数，并将参数传递进去，可以开始异步操作。如果异步操作成功，我们将结果传递给下一个 yield 语句；如果操作失败，我们将错误信息传递给 catch 语句。这样，我们就可以通过 generator 和 Promise 结合处理异步操作了。
总结
通过将 generator 与 Promise 结合使用，我们可以更加方便地处理异步代码，并提高代码的可读性和可维护性。虽然生成器和 promise 可以独立地工作，但将它们结合起来可以实现更好的效果。我们应该学习并掌握这两个概念，并在实际开发中加以应用。
以上就是使用 generator 与 Promise 结合的详细指导和示例代码。希望这篇能够帮助您更好地理解这两个概念，并在实际开发中发挥更加高效的作用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649528b048841e989426d531