JS 里的 async & await 语法糖

应当在学完 Promise 实现异步编程 后才能理解此语法糖的优势。

先来看看两个关键字的作用：

基本概念

async：声明一个异步函数

[!tip] 关键点
很多人只记得 async 里用来放 await 语句。还有一个关键特性是：

• async 声明的函数会 return 一个 promise

async 关键字用于函数声明，它表示这个函数内部可能会有异步操作。声明的函数会返回一个 Promise。

// 用于声明箭头函数
const fn = async (params) => {
    // ...
}

// 用于声明普通函数
async function fn(params) {
    // ...
}

async 函数有两大特点：

• 如果函数代码中 return 了一个非 Promise 的值（比如一个数字或字符串），这个值会被自动包装在一个 resolved 的 Promise 中。
• 如果函数 throw 了一个错误，它会返回一个 rejected 的 Promise 。

await：等待一个 Promise

await 后面必须跟着一个 Promise。await 只能在 async 函数内部使用。它的作用是“暂停”async 函数的执行，等待它后面的 Promise 完成（settle）。

[!tip] 关键点
async 函数会在内部的 await 语句处停住，等待它的那个 promise 敲定。这点很重要

1. 如果 Promise 变成 resolved（成功），await 会返回 Promise 的结果值。
2. 如果 Promise 变成 rejected（失败），await 会抛出这个错误，就像 throw 语句一样。

错误处理

不同于 promise 里用 .catch()，对于 async/await，try...catch 是最标准、最推荐的错误处理方式。它能捕获 await 期间任何 Promise 的 rejection 以及其他同步代码的错误。

async function getData() {
  try {
    // 你的 "开心路径" (happy path) 代码
    const user = await fetchUser();
    const posts = await fetchPosts(user.id);
    console.log(posts);
  } catch (err) {
    // 所有错误都会在这里被捕获
    console.error('操作失败:', err);
    // 可以在这里做一些UI提示、日志上报等
  }
}