异步 fetch 函数返回的是 Promise，不能直接通过赋值获取结果；必须使用 .then() 链式调用或 await（在 async 函数内）来提取解析后的数据。
异步 `fetch` 函数返回的是 promise，不能直接通过赋值获取结果；必须使用 `.then()` 链式调用或 `await`（在 async 函数内）来提取解析后的数据。
在 JavaScript 中，async 函数本质上是返回 Promise 的语法糖。因此，当你调用 getData(url) 时，得到的并非实际数据，而是一个处于 pending 状态的 Promise 对象——这正是 console.log(desiredData) 输出 Promise {<pending>}</pending>（而非空，但看似“空”）的根本原因。
✅ 正确做法一：使用 .then() 处理 Promise
const desiredData = getData('https://api.example.com/data');
desiredData.then(data => {
console.log(data); // ✅ 此处才能访问到解析后的 JSON 数据
}).catch(error => {
console.error('获取数据失败:', error);
});
✅ 正确做法二：在 async 函数内部使用 await（推荐，更直观）
const fetchDataAndUse = async () => {
try {
const data = await getData('https://api.example.com/data');
console.log(data); // ✅ 直接获得解析后的数据
// 在此处继续处理 data，如渲染页面、更新状态等
} catch (error) {
console.error('请求失败:', error);
}
};
fetchDataAndUse(); // 别忘了调用该 async 函数
⚠️ 注意事项：
- ❌ 不要试图在顶层同步上下文中“等待”异步结果（如
const data = getData(url);后立即使用data.xxx），这会导致undefined或运行时错误； - ✅ 所有依赖异步数据的逻辑，必须置于
.then()回调、await表达式之后，或封装在async函数中； - ? 若需多个异步请求串行/并行执行，可结合
await Promise.all([p1, p2])提升效率； - ? 始终保留
try...catch或.catch()，避免未捕获的 Promise rejection 导致静默失败。
总结：理解 Promise 生命周期（pending → fulfilled/rejected）是驾驭异步数据流的关键。async/await 并非消除异步性，而是让异步代码写起来像同步——但调用者仍需主动“等待”，而非假设数据已就绪。
