JavaScript中Promise.all执行完成后无法触发依赖结果的回调函数问题排查

• Promise 状态永久挂起
  每个returnValueX函数内部创建Promise时，executor执行逻辑里仅完成了闭包变量赋值、最后直接return结果值，全程没有调用resolve()方法通知Promise异步操作已完成。所有返回的Promise会永远停在pending状态，Promise.all会一直等待所有传入的Promise进入完成/失败状态，后续逻辑无法正常推进。
• .then() 回调传参逻辑错误
  当前代码写法是.then(myFunction(finalVal1, finalVal2, finalVal3, finalVal4))，这种写法并不是把myFunction注册为Promise状态变更后的回调。代码运行到这一行时，会立刻同步执行myFunction函数，把它的返回值（这里是undefined）作为.then()的入参。由于此时传入的不是可执行的回调函数，.then()会直接透传Promise值，根本不会在所有异步操作完成后触发myFunction执行。
• 冗余的闭包变量中转逻辑
  外层定义finalValX变量存异步结果的写法完全没有必要，Promise本身就会通过resolve方法传递异步执行的结果，Promise.all会自动把所有成功完成的Promise结果按顺序组成数组返回，绕一圈用闭包变量存值反而容易出现赋值时机和读取时机不匹配的问题。

async function returnValues() {
  function returnValue1() {
    return new Promise((resolve, reject) => {
      // 原有业务逻辑
      const result1 = {};
      // 显式调用resolve，传递结果并将Promise标记为完成状态
      resolve(result1);
    })
  }

  function returnValue2() {
    return new Promise((resolve, reject) => {
      const result2 = {};
      resolve(result2);
    })
  }

  function returnValue3() {
    return new Promise((resolve, reject) => {
      const result3 = {};
      resolve(result3);
    })
  }

  function returnValue4() {
    return new Promise((resolve, reject) => {
      const result4 = {};
      resolve(result4);
    })
  }

  // 等待所有Promise完成，拿到按顺序排列的结果数组
  const allResults = await Promise.all([
    returnValue1(),
    returnValue2(),
    returnValue3(),
    returnValue4()
  ]);
  // 将结果解构传入myFunction执行
  myFunction(...allResults);
}

function myFunction(finalVal1, finalVal2, finalVal3, finalVal4) {
  console.log(finalVal1);
  console.log(finalVal2);
  console.log(finalVal3);
  console.log(finalVal4);
}

如果业务逻辑里存在异步操作（比如接口请求、定时器），只需要在异步操作的回调里调用resolve即可，不要在executor同步阶段直接给外层变量赋值。

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