20. async，await

async/await 是 Generator 和 Promise 的语法糖（async 取代 *，await 取代 yield）ES2017

语法

async function f() {
  let res = await promise()
  
  return res
}

await：

• 让 JavaScript 引擎等待直到 promise 完成（settled）并返回结果，它是 .then() 的更优雅写法
• 当函数执行的时候，一旦遇到 await 就会先返回，等到异步操作完成，再接着执行函数体内后面的语句
• 像 promise.then 那样，await 允许使用 thenable 对象（可调用 then 方法的对象）
• 如果 await 后面的 promise 最终 reject 了，那么等价于该行 throw 了一个错误

返回值

1. 函数总是返回一个 promise，其他值将自动被包装在一个 resolved 的 promise 中
2. 函数返回值会被 .then 方法的回调函数接收到，内部抛出的错误会被 .catch 方法的回调函数接收到
3. await 后面跟 promise 返回值：

• 如果 promise 正常 resolve，返回的就是其 resolve 时传入的结果
• 如果 promise 被 reject，它将 throw reject 时传入的错误

4. await 后面跟非 promise 返回值：

• 直接返回 resolved 的该值

顶层 awaitES2022

当处于一个 module 中时，那么在顶层可以直接使用 await（此时不需要 async）

错误处理

任何一个 await 语句后面的 Promise 对象变为 reject 状态，那么整个 async 函数都会中断执行，
如果不想中断，可以使用 try…catch 包住或者在 await 语句后面加 .catch

try…catch

async function f() {
  let res = 0
 
  try {
    res = await promise()
  } catch (error) {
    console.log(error)
  }
  
  return res
}
 
f()

.catch

async function f() {
  await promise().catch(() => {});
  return
}
 
// 或者
async function f() {
  await promise()
  return
}
f().catch(() => {})

注意，如果要将 await 的结果赋值给一个变量，则不能这么写：

async function f() {
  let info = await promise().catch(() => {}); // 因为 .catch() 返回的是一个新的 Promise，所以错误
}

总结