Promise.all 错误处理异常求助：捕获错误后仍执行后续Promise

你遇到的情况是Promise.all的典型特性导致的，我来帮你拆解问题根源和解决办法：

1. 为什么其他Promise会继续执行？ #

当你调用Promise.all([p1, p2, p3])时，传入的三个Promise会同时启动执行，彼此之间没有依赖关系的话，都会独立运行。哪怕pagination()很快就抛出异常进入rejected状态，prepareParams和fetchRecipes已经处于运行状态，所以会继续执行直到完成或失败。Promise.all的catch只是捕获第一个reject的异常，但没有能力终止已经在运行的异步任务。

2. 优化你的pagination()方法 #

你在Promise的executor函数里直接用throw虽然能被Promise捕获并转为reject状态，但这种写法不够规范——如果后续在异步逻辑里抛出异常（比如setTimeout内部），Promise是没法捕获的。更可靠的方式是使用reject()方法：

pagination(): Promise<any> {
  return new Promise((resolve, reject) => {
    if(/* 你的成功条件 */) {
      // 成功时返回结果
      resolve(/* 这里可以传入需要返回的数据 */);
    } else {
      // 失败时调用reject传递异常信息
      reject("no more results...");
    }
  });
}

3. 核心解决方案：阻止后续任务执行 #

如果你希望在pagination()失败时，后面的prepareParams和fetchRecipes根本不执行，那么需要把它们改为依赖于pagination()的成功，也就是先执行pagination()，成功后再启动另外两个Promise：

return this.pagination()
  .then(() => {
    // 只有pagination成功，才会执行这两个Promise
    return Promise.all([
      this.prepareParams(this.params, this.requestData),
      this.fetchRecipes(this.apiData, this.params)
    ]);
  })
  .catch(e => console.log(e));

4. 进阶方案：取消正在运行的任务（如果需要） #

如果你的业务场景需要同时启动所有任务，但在pagination()失败时能取消其他正在运行的任务，那么可以使用AbortController（现代浏览器和Node.js都支持），不过这需要你的prepareParams和fetchRecipes方法支持接收中止信号：

第一步：修改方法支持中止信号 #

prepareParams(params: any, requestData: any, signal: AbortSignal): Promise<any> {
  return new Promise((resolve, reject) => {
    // 先检查是否已中止
    if (signal.aborted) {
      reject(new Error("任务已被中止"));
      return;
    }

    // 监听中止信号
    signal.addEventListener('abort', () => {
      reject(new Error("任务已被中止"));
    });

    // 你的原有逻辑...
    // 比如如果是异步请求，可以把signal传给fetch：
    // fetch(url, { signal })
  });
}

// 同理修改fetchRecipes方法
fetchRecipes(apiData: any, params: any, signal: AbortSignal): Promise<any> {
  return new Promise((resolve, reject) => {
    if (signal.aborted) {
      reject(new Error("任务已被中止"));
      return;
    }

    signal.addEventListener('abort', () => {
      reject(new Error("任务已被中止"));
    });

    // 原有逻辑...
  });
}

第二步：使用AbortController控制任务 #

const controller = new AbortController();
const signal = controller.signal;

return Promise.all([
  this.pagination().catch(e => {
    // pagination失败时，中止其他任务
    controller.abort();
    throw e; // 继续抛出异常，让外层catch捕获
  }),
  this.prepareParams(this.params, this.requestData, signal),
  this.fetchRecipes(this.apiData, this.params, signal)
])
.catch(e => console.log(e));

这个方案适合那些需要同时启动任务，但又需要在某个任务失败时取消其他任务的场景，但前提是你的异步方法支持中止逻辑。

内容的提问来源于stack exchange，提问作者Roman Dornhof