JavaScript中的async和await是什么_它们如何简化异步代码呢-js教程-PHP中文网

JavaScript中的async和await是什么_它们如何简化异步代码呢

紅蓮之龍

发布： 2025-12-17 16:49:02

原创

106人浏览过

async/await 是基于 Promise 的语法糖，使异步代码更简洁直观；async 函数自动返回 Promise，await 在 async 内暂停执行并等待 Promise 完成，推荐用 try/catch 处理错误，注意避免滥用导致串行阻塞。

javascript中的async和await是什么_它们如何简化异步代码呢

async 和 await 是 JavaScript 中处理异步操作的语法糖，本质是基于 Promise 的更简洁写法。它们不改变异步本质，但让异步代码看起来像同步代码，大幅降低理解与维护成本。

async 函数：自动返回 Promise 的函数

在函数声明前加 async，该函数就变成异步函数。它会自动把返回值包装成 Promise——即使你 return 一个普通值，也会被转为 Promise.resolve(value)；如果抛出错误，则等价于 Promise.reject(error)。

不能用 await 在普通函数或顶层作用域（ES2022 之前）中使用，必须在 async 函数内
async 函数本身是同步执行的，只是内部遇到 await 时会暂停，并把控制权交还给事件循环

await 表达式：等待 Promise 完成的“暂停键”

await 只能在 async 函数里用，它会让 JS 引擎暂停当前函数执行，直到右侧的 Promise 被 fulfilled 或 rejected。一旦完成，就继续往下执行，并返回 fulfilled 的值（或抛出 rejected 的错误）。

await 后面不一定是 Promise：如果不是，会被自动转为 Promise.resolve(...)
await 不阻塞整个线程，只是挂起当前 async 函数，其他任务（如定时器、用户交互）仍可运行
错误处理推荐用 try/catch，因为 await 遇到 reject 会直接抛异常

对比传统 Promise 链：代码更扁平，逻辑更直观

以前用 .then().then().catch() 容易形成“回调地狱”的变体，嵌套虽浅但链式过长、错误传递绕弯。用 async/await 后，异步步骤可以按自然顺序从上到下书写。

立即学习“Java免费学习笔记（深入）”；

Magic AI Avatars

神奇的AI头像，获得200多个由AI制作的自定义头像。

查看详情

例如连续请求用户信息和其订单：

// Promise 风格（容易分散注意力）
getUser(id)
  .then(user => getOrders(user.id))
  .then(orders => console.log(orders))
  .catch(err => console.error(err));

// async/await 风格（接近同步读感）
async function showUserOrders(id) {
  try {
    const user = await getUser(id);
    const orders = await getOrders(user.id);
    console.log(orders);
  } catch (err) {
    console.error(err);
  }
}

登录后复制