浏览器中不加断点JavaScript Promise无法正常获取REST API返回值怎么办

这是JavaScript异步执行机制导致的典型时序问题：

• userClient.session.get(userId)是异步请求，执行后会立即返回Promise，不会阻塞后续代码运行
• 你的代码在发起异步请求后没有等待请求完成，就直接返回了初始化的空user对象
• API请求成功后触发的then回调是在函数返回user之后才执行的，此时修改user属性无法影响你之前拿到的返回值的使用逻辑。

你加断点能正常拿到值的原因是：断点卡在return user行时，会暂停函数返回的执行流程，这段等待时间刚好足够异步API请求完成、then回调先执行完成给user赋值，再放开断点返回的就是已经填充好数据的对象，只是巧合符合预期，不是正常逻辑。

你需要让函数返回异步执行的结果，有两种常用实现方式：

方式1：直接返回Promise，调用时用then接收结果 #

function GetSession(userClient, userId) {
  return userClient.session.get(userId)
    .then(function(result) {
      return {
        userId: result.userId,
        name: result.name
      };
    })
    .catch(err => {
      alert(err);
      throw err; // 抛出错误方便调用方额外处理异常逻辑
    });
}

// 调用示例
GetSession(yourClient, targetUserId).then(user => {
  // 此处才可拿到正确填充的user对象
  console.log(user);
})

方式2：用async/await语法简化异步逻辑，可读性更高 #

async function GetSession(userClient, userId) {
  try {
    const result = await userClient.session.get(userId);
    return {
      userId: result.userId,
      name: result.name
    };
  } catch (err) {
    alert(err);
    throw err;
  }
}

// 调用示例（需要在async函数内使用await）
async function handleSession() {
  const user = await GetSession(yourClient, targetUserId);
  console.log(user);
}

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