async和await

Posted 2022-02-03 还是不会呀

async和await

• • async的使用
  • await的使用

在async和await出来之前，异步回调的方法就有
1、回调嵌套
2、Promsie的链式回调
3、Generator的复杂繁琐调用方式

async/await采用同步的思维来解决异步问题的方式，使代码的可读性更强了。

async的使用

在函数的function关键字前加上 async，该函数就变成了 异步函数。

该函数和普通函数的区别：

• 异步函数的返回值是一个Promsie对象，相当于返回的值包裹在了Promise.resolve()内进行返回的
• 异步函数内可以使用await关键字

async函数内抛出错误，是通过返回值的Promsie对象catch进行捕获。

1、返回一个普通的值或者对象

async function foo() 
  return "fzb";


foo().then((res) => 
  console.log(res); // "fzb"
);

2、返回一个Promise对象

async function foo() 
  return new Promise((resolve, reject) => 
    // resolve("fzb");
    reject("error message");
  );


foo()
  .then((res) => 
    console.log(res); // "fzb"
  )
  .catch((error) => 
    console.log(error); // "error message"
  );

3、返回一个实现了thenable的对象

async function foo() 
  return 
    then: (resolve, reject) => 
      resolve("fzb");
    ,
  ;

foo().then((res) => 
  console.log(res); // fzb
);

await的使用

await关键字只能在async内进行使用。

async function foo() 
  // 1、await后面接一个普通的值或者对象
  const res1 = await "fzb";
  console.log(res1); // "fzb"
  const res2 = await  name: "fzb" ;
  console.log(res2); //  name: 'fzb' 

  // 2、await后面接着一个thenable对象,若是reject状态那么异步函数返回的promise对象catch进行捕获错误
  const res3 = await 
    then: function (resolve, reject) 
      resolve("fzb");
      //   reject("error message");
    ,
  ;
  console.log(res3); // "fzb"

  // 3、await后面接着一个Promsie对象，若是reject状态那么异步函数返回的promise对象catch进行捕获错误
  const res4 = await new Promise((resolve, reject) => 
    resolve("fzb");
    // reject("error message");
  );
  console.log(res4); // "fzb"

foo()
  .then((res) => 
    console.log("res:", res); // res: undefined
  )
  .catch((err) => 
    console.log("err:", err); // err: error message
  );