清淨
  • Java

    • Java 基础
  • 框架

    • Flyway
    • MapStruct
    • Spring Cloud
  • 中间件

    • Elasticsearch
    • Redis
    • RabbitMQ
    • Kafka
  • 三剑客

    • HTML
    • CSS
    • JavaScript
  • 进阶

    • jQuery
    • ECMAScript6
    • TypeScript
  • Vue

    • Vue2
    • Vue3
    • VuePress
  • Linux
  • Jenkins
  • Maven
  • MySQL
  • 插件工具
  • 代码集成
  • 其它

    • 数据结构与算法
    • 计算机网络
    • 操作系统
    • 设计模式
迁移日志
订阅号
微信订阅号
微信订阅号
GitHub
  • Java

    • Java 基础
  • 框架

    • Flyway
    • MapStruct
    • Spring Cloud
  • 中间件

    • Elasticsearch
    • Redis
    • RabbitMQ
    • Kafka
  • 三剑客

    • HTML
    • CSS
    • JavaScript
  • 进阶

    • jQuery
    • ECMAScript6
    • TypeScript
  • Vue

    • Vue2
    • Vue3
    • VuePress
  • Linux
  • Jenkins
  • Maven
  • MySQL
  • 插件工具
  • 代码集成
  • 其它

    • 数据结构与算法
    • 计算机网络
    • 操作系统
    • 设计模式
迁移日志
订阅号
微信订阅号
微信订阅号
GitHub
  • ECMAScript6

    • 简介
    • let
    • const
    • 解构赋值
    • 对象简写
    • 箭头函数
    • 参数默认值
    • 剩余参数
    • 可选链操作符
    • 空值合并运算符
    • 逻辑空赋值
    • 模板字符串
    • 扩展运算符 (展开语法)
    • Array 扩展
    • String 扩展
    • Number 扩展
    • Object 扩展
    • 迭代器
    • 生成器
    • BigInt
    • Set
    • Map
    • class
    • 模块化
    • globalThis
    • Promise
    • async-await

async-await

ES6 引入了 async 和 await 关键字,用于简化异步编程。它们使得异步代码的编写更像同步代码,提高了可读性和可维护性。

async

一种异步编程的解决方案,它可以让异步代码像同步代码一样。async 函数的返回值是一个 Promise 对象。

async function foo() {
  console.log('123')
  // 相当于调用 resolve( 'success' )
  return 'success'
}
const result = foo()
console.log(result)

如果 async 的返回值不是一个 Promise 对象,那么它返回的 Promise 是成功状态的 Promise,async 函数的返回值会被放入 resolve(data) 中。

async function foo() {
  console.log('123')
  // 返回失败的 Promise, 相当于调用 reject( 'fail' )
  throw new Error('fail') 
}
const result = foo()
console.log(result)

返回值为 Promise:

async function foo() {
  console.log('123')
  return new Promise((resolve, reject) => {
    resolve('成功')
  })
}
const result = foo()
console.log(result)

await

await 关键字只能在 async 函数中使,它会等待一个 Promise 对象的结果。使用 await 可以让异步代码看起来像同步代码一样,避免了回调地狱。

  1. await 必须写在 async 函数中
  2. await 右侧的表达式一般为 Promise 对象
  3. await 返回的是成功状态的 Promise 的值
  4. await 中的 Promise 如果失败,就会抛出异常,需要用 try-catch 捕获
const p = new Promise((resolve, reject) => {
  resolve('success')
})
async function foo() {
  let result = await p
  console.log(result) // success
}
foo()
const p = new Promise((resolve, reject) => {
  reject('失败')
})
async function foo() {
  try {
    let result = await p
  } catch (e) {
    console.log(e) // 失败
  }
}
foo()
想要编辑此页?
上次更新: 2025/7/1 09:50
贡献者: Junfeng Dai
←Promise
[ 纸上得来终觉浅绝知此事要躬行 ]
Copyright © 2021-present Junfeng Dai
蜀ICP备2021009537号