如何使用js-csp库实现等待Promise成功后再继续yield？

阿华AIGC实验室

2026-5-15

在js-csp中等待Promise完成后继续执行的最佳实践

首先明确：js-csp本身没有像co那样原生支持直接yield Promise，因为它的核心设计围绕CSP通信模型（channel、take/put）而非Promise链。但我们可以通过适配Promise到js-csp的异步模型，实现优雅的等待逻辑，完全不需要手动操作迭代器（csp.go会帮我们管理迭代器的生命周期）。

下面是两种推荐的实现方式：

方法1：使用`csp.fromPromise`（推荐，适用于较新版本的js-csp）

js-csp提供了csp.fromPromise工具函数，可以把一个Promise转换成一个临时channel：当Promise resolve时，结果会被发送到这个channel；当Promise reject时，会抛出错误。我们只需要用csp.take来等待这个channel的消息，就能实现等待Promise完成的效果。

示例代码：

import * as csp from 'js-csp';

const goRoutine = function*() {
  while (true) {
    const payload = yield csp.take(CHANNELS.SAVE_TO_SERVER);
    try {
      // 将Promise转换为channel，take操作会等待Promise完成
      const saveResult = yield csp.take(csp.fromPromise(api.save(payload)));
      console.log("saved successfully:", saveResult);
    } catch (err) {
      // 处理Promise reject的情况
      console.error("save failed:", err);
    }
  }
};

csp.go(goRoutine);

方法2：自定义Promise适配函数（兼容旧版本js-csp）

如果你的js-csp版本没有fromPromise，可以自己封装一个适配函数，把Promise转换成js-csp支持的“continuation风格”函数（即接受(err, result)回调的函数）。js-csp的yield会自动处理这类函数，等待回调触发后继续执行。

示例代码：

import * as csp from 'js-csp';

// 封装Promise为js-csp可yield的异步操作
function waitForPromise(promise) {
  return function(callback) {
    promise
      .then(result => callback(null, result)) // 成功时传递结果
      .catch(err => callback(err)); // 失败时传递错误
  };
}

const goRoutine = function*() {
  while (true) {
    const payload = yield csp.take(CHANNELS.SAVE_TO_SERVER);
    try {
      const saveResult = yield waitForPromise(api.save(payload));
      console.log("saved successfully:", saveResult);
    } catch (err) {
      console.error("save failed:", err);
    }
  }
};

csp.go(goRoutine);