JavaScript中如何等待多个Promise完成后再执行后续代码？

你的代码核心问题是所有Promise都没有调用resolve()方法，导致Promise始终处于pending状态，await会一直阻塞后续代码执行，所以Finished和Finished here too..永远不会输出。另外还有两个未定义的变量config和fullResales需要处理。

具体问题点 #

• getConfigData、getResales、allDone这三个函数返回的Promise，都只在构造函数里执行了console.log，但从未调用resolve()，Promise状态无法变为fulfilled，await会无限等待。
• getData函数里的console.log(config)和console.log(fullResales)，这两个变量没有定义，执行时会抛出ReferenceError。

修复后的代码 #

function getConfigData() {
  console.log('GET ConfigData Now...');
  return new Promise((resolve) => {
    console.log("hello");
    // 调用resolve，标记Promise完成
    resolve('config数据'); // 可传入需要返回的实际数据
  });
}

function getResales() {
  console.log('GET Resales Now...');
  return new Promise((resolve) => {
    console.log("world");
    resolve('resales数据');
  });
}

function allDone() {
  console.log('allDone Now...');
  return new Promise((resolve) => {
    console.log("Finished");
    resolve();
  });
}

async function getData() {
  // 接收Promise.allSettled的返回结果
  const [configResult, resalesResult] = await Promise.allSettled([getConfigData(), getResales()]);
  // 从结果中提取成功返回的数据
  const config = configResult.status === 'fulfilled' ? configResult.value : null;
  const fullResales = resalesResult.status === 'fulfilled' ? resalesResult.value : null;
  
  console.log(config);
  console.log(fullResales);
  
  await Promise.allSettled([allDone()]);
  console.log('Finished here too..');
}

getData()

修复后控制台输出 #

GET ConfigData Now... 
hello 
GET Resales Now... 
world
config数据
resales数据
allDone Now...
Finished
Finished here too..

如果你的预期输出不需要config和fullResales的打印内容，可以直接删除相关代码，只保留Promise的resolve()调用即可。

内容的提问来源于stack exchange，提问作者Johnny John Boy