async和await关键字

25. async和await关键字

1. async

async（异步）用于定义一个异步函数。异步函数是一种返回 Promise 对象的函数，可以使用 await 关键字等待异步操作的结果，以同步的方式处理异步操作。

//返回一个普通值，会被Promise.resolve()包装后返回
async function foo() {
   
  return 123
}
console.log(foo());//Promise {<fulfilled>: 123}
foo().then(res => console.log(res));//123
foo().then(console.log);//123

//返回Promise.resolve(), 效果一样, reject同理
async function foo() {
   
  return Promise.resolve(456)
}
foo().then(res => console.log(res));//456

//返回thenable对象
async function foo() {
   
  return {
   
    then(callback) {
   
      callback(789)
    }
  }
}
foo().then(res => console.log(res));//789

2. await

await（等待）用于等待一个异步操作的结果，并将其解析为该操作返回的值。在异步函数中使用 await 关键字可以实现异步操作的同步处理，以避免回调函数嵌套和复杂的错误处理。注：await关键字只能在异步函数中使用。

// 以前的异步代码
let p = new Promise((resolve, reject) => setTimeout(resolve, 2000, 123))
p.then(res => console.log(res));//123
// 使用async/await关键字的异步代码
async function foo() {
   
  let p = new Promise((resolve, reject) => setTimeout(resolve, 2000, 456))
  console.log(await p);
  console.log(789);
}
foo();//456  789

// 异步执行
async function foo() {
   
  await new Promise((resolve, reject) => setTimeout(resolve, 1000))
  console.log("1000ms后执行的代码");
}
foo();//1000ms后执行的代码

// 异步获取数据
async function getData() {
   
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

getData().then(data => console.log(data)).catch(error => console.log(error));