并行级联Promise问题：为何完成提示提前输出？

你的代码存在两个关键问题，导致Promise.all提前触发了完成回调：

1. a2Promise和b2Promise未返回Promise实例 #

这两个函数当前没有返回值（默认返回undefined），而Promise.all要求传入Promise实例数组。当传入undefined时，Promise.all会直接将其视为已完成状态，立刻执行后续的then回调。

2. then回调内的Promise未返回 #

你在a1Promise().then()里创建了a2的Promise，但没有把这个Promise返回给then方法，导致a1Promise().then()对应的Promise会在a1完成后直接resolve，不会等待a2的异步任务结束。

修正后的代码 #

console.log("Building A1");

const a1Promise = () => { 
  return new Promise((resolve, reject) => {
    console.log("A1 Started");
    setTimeout(() => {
      console.log("A1 completed");
      resolve();
    }, 1000);
  }) 
};

console.log("Building B1");

const b1Promise = () => { 
  return new Promise((resolve, reject) => {
    console.log("B1 Started");
    setTimeout(() => {
      console.log("B1 completed");
      resolve();
    }, 1500);
  }) 
};

console.log("Building A2");

// 修正点1：返回a1Promise().then()的结果；修正点2：then回调里返回a2的Promise
const a2Promise = () => { 
  return a1Promise().then(() => {
    return new Promise((resolve, reject) => {
      console.log("A2 Started");
      setTimeout(() => {
        console.log("A2 completed");
        resolve();
      }, 2000);
    });
  }) 
};

console.log("Building B2");

// 同样的修正逻辑
const b2Promise = () => { 
  return b1Promise().then(() => {
    return new Promise((resolve, reject) => {
      console.log("B2 Started");
      setTimeout(() => {
        console.log("B2 completed");
        resolve();
      }, 2500);
    });
  }) 
};

console.log("Before Promise All");

Promise.all([a2Promise(), b2Promise()]).then(() => {
  console.log("All 'A' and 'B' promises completed in parallel"); 
});

修正后输出顺序 #

Building A1
Building B1
Building A2
Building B2
Before Promise All
A1 Started
B1 Started
A1 completed
A2 Started
B1 completed
B2 Started
A2 completed
B2 completed
All 'A' and 'B' promises completed in parallel

这样就能保证最终的完成提示在所有任务结束后才输出。

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