首页 › JavaScript › 异步编程 › async/await 与错误处理

async/await

异步编程的"语法糖"，让异步代码看起来像同步代码。

// async 函数返回 Promise
async function getUser(id) {
  return { id, name: '张三' };
}
// 等价于：function getUser(id) { return Promise.resolve({...}); }

// await 等待 Promise 完成
async function loadData() {
  const user = await fetchUser(1);
  const posts = await fetchPosts(user.id);
  const comments = await fetchComments(posts[0].id);
  return comments;
}

错误处理

async function loadData() {
  try {
    const user = await fetchUser(1);
    const posts = await fetchPosts(user.id);
    return posts;
  } catch (error) {
    console.error('加载失败:', error.message);
    return [];           // 降级返回
  } finally {
    console.log('请求完成');
  }
}

并行执行

// ❌ 串行（慢）
async function loadSerial() {
  const user = await fetchUser(1);
  const posts = await fetchPosts();
  // 总共：2 次等待
}

// ✅ 并行（快）
async function loadParallel() {
  const [user, posts] = await Promise.all([
    fetchUser(1),
    fetchPosts()
  ]);
  // 总共：1 次等待（同时发送）
}

顶层 await

// 模块中可以直接使用 await（ES2022）
const data = await fetch('/api/config').then(r => r.json());
export default data;

小结

语法	作用
async function	声明异步函数，返回 Promise
await promise	等待 Promise 完成
try...catch	捕获 await 中的异常
Promise.all + await	并行执行

上一节：Promise 详解 下一节：Event Loop 与微任务/宏任务

贡献者: 布欧-Lewyon