如何将Promise的实际响应值而非Promise对象存储到父函数变量中？

这是异步编程里非常常见的误区，我来帮你理清楚怎么正确获取Promise的实际响应值～

为什么会拿到Promise对象而非实际响应？ #

Promise是异步执行的，当你直接把Promise赋值给变量时，它的异步操作还没完成（处于pending状态），所以变量里存的是Promise对象本身，不是最终的响应结果。

两种正确的实现方式 #

方法1：使用async/await（推荐，代码更像同步逻辑）

你需要把父函数标记为async，然后用await关键字等待Promise完成，这样就能直接拿到实际值并赋值给变量了。记得用try/catch处理可能的错误：

// 模拟返回Promise的请求函数（比如获取token的接口）
function fetchToken() {
  return new Promise((resolve, reject) => {
    // 模拟异步请求延迟
    setTimeout(() => {
      resolve("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."); // 实际token值
      // 如果请求失败，就调用reject(new Error("获取token失败"))
    }, 1000);
  });
}

// 父函数必须标记为async
async function getTokenAndStore() {
  try {
    // await会等待Promise resolve后，把实际值赋值给token
    const token = await fetchToken();
    console.log(token); // 这里就是你要的实际token值
    // 接下来可以把token用于其他业务逻辑，比如存到全局变量、localStorage等
  } catch (error) {
    // 处理Promise reject的情况（比如请求失败）
    console.error("获取token出错:", error.message);
  }
}

// 调用函数
getTokenAndStore();

方法2：使用.then()链式调用（传统Promise写法）

如果你的运行环境不支持async/await（比如旧版浏览器），可以用Promise的.then()方法，在回调函数里获取实际响应值：

function fetchToken() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...");
    }, 1000);
  });
}

function getTokenAndStore() {
  fetchToken()
    .then((token) => {
      // 这里的token就是实际响应值
      console.log(token);
      const storedToken = token; // 存入变量
      // 所有依赖token的逻辑都要写在这个回调里
    })
    .catch((error) => {
      console.error("获取token出错:", error.message);
    });
}

getTokenAndStore();

避坑：错误的写法示例 #

// ❌ 错误：直接赋值得到的是Promise对象
const token = fetchToken();
console.log(token); // 输出: Promise { <pending> }

这种写法的问题在于，fetchToken()返回的Promise还没完成异步操作，所以token变量存的是未完成的Promise，不是最终结果。

核心总结 #

不管用哪种方法，核心都是等待Promise完成后再获取值——异步操作的结果不能像同步代码那样直接赋值，必须在异步回调（.then()）或者await之后处理。

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