await返回之后的赋值给一个变量可以打印出数值,但是直接return回去之后,在另一个函数打印出来却是一个promise

🧪 现象描述

你说:

await 返回之后赋值给一个变量可以打印出数值,但是 return 回去之后,在另一个函数打印出来却是一个 Promise

这是完全正常的,原因在于:使用了 await 的函数本身返回的是一个 Promise


🔍 示例说明

示例 1:你在 async 函数中用 await

javascript 复制代码
js
深色版本
async function getData() {
  const res = await fetchSomeData(); // 假设 fetchSomeData 返回一个 Promise
  console.log(res); // 这里能正常输出数据,比如 "Hello"
  return res;       // 注意这里 return 的值会被包装成 Promise
}

当你调用这个函数时:

ini 复制代码
js
深色版本
const result = getData();
console.log(result); // 输出: Promise { <pending> }

为什么会这样?

➡️ 因为 只要是 async 函数,它的返回值永远是一个 Promise


✅ 如何获取 async 函数返回的真实值?

你需要再用 .then() 或者在另一个 async 函数中用 await 来取值。

方法一:用 .then

ini 复制代码
js
深色版本
getData().then(data => {
  console.log(data); // 这里才是真正的数据,比如 "Hello"
});

方法二:在另一个 async 函数中用 await

javascript 复制代码
js
深色版本
async function useData() {
  const data = await getData();
  console.log(data); // 这里才是真正的数据
}

📌 关键点总结

内容 说明
await 的作用 暂停当前异步函数执行,直到 Promise resolve,并取出其值
async 函数的返回值 永远是一个 Promise,即使你 return 123,也会变成 Promise.resolve(123)
如果直接 return res 其实就是把 res 包装成一个 resolved 的 Promise
所以你看到的 Promise 是正常的 你需要继续用 .then()await 取出里面的值

🧠 举个完整例子

javascript 复制代码
js
深色版本
function fetchSomeData() {
  return new Promise((resolve) => {
    setTimeout(() => resolve("Hello"), 1000);
  });
}

async function getData() {
  const res = await fetchSomeData();
  return res; // 相当于 Promise.resolve("Hello")
}

// ❌ 错误方式:直接打印 async 函数结果
console.log(getData()); // Promise { <pending> }

// ✅ 正确方式 1:用 .then()
getData().then(data => console.log(data)); // 输出 Hello

// ✅ 正确方式 2:在 async 函数中 await
async function main() {
  const data = await getData();
  console.log(data); // 输出 Hello
}

main();

🚫 常见误区

  • ❌ 认为 return res 就可以直接拿到原始值
  • ❌ 在外部试图同步访问异步函数的结果(这不可能)

✅ 最佳实践建议

  • 使用 async/await 时,始终保持"链式异步",不要试图"同步化"异步操作。
  • 如果你在某个函数中用了 await,那这个函数应该也标记为 async
  • 要想拿到最终值,必须通过 .then() 或嵌套的 await
相关推荐
咖啡の猫2 小时前
Shell脚本-for循环应用案例
前端·chrome
百万蹄蹄向前冲4 小时前
Trae分析Phaser.js游戏《洋葱头捡星星》
前端·游戏开发·trae
朝阳5815 小时前
在浏览器端使用 xml2js 遇到的报错及解决方法
前端
GIS之路5 小时前
GeoTools 读取影像元数据
前端
ssshooter5 小时前
VSCode 自带的 TS 版本可能跟项目TS 版本不一样
前端·面试·typescript
Jerry6 小时前
Jetpack Compose 中的状态
前端
dae bal7 小时前
关于RSA和AES加密
前端·vue.js
柳杉7 小时前
使用three.js搭建3d隧道监测-2
前端·javascript·数据可视化
lynn8570_blog7 小时前
低端设备加载webp ANR
前端·算法
LKAI.8 小时前
传统方式部署(RuoYi-Cloud)微服务
java·linux·前端·后端·微服务·node.js·ruoyi