首页 > 其他分享 >async-await

async-await

时间:2022-09-07 13:55:06浏览次数:82  
标签:function resolve await Promise async fn

async 函数介绍

  1、async 函数执行结果是: 返回一个 Promise 对象( newPromise ) 

    • fn 返回普通值(只要不抛错返回的 promise 的状态就是 fulfilled )
      async function fn() {
          setTimeout(() => {resolve("syy")}, 3000) // 不会等待当前异步代码执行完,再确定 newPromise;
          return 10; // 如果没返回值,则 newPromise = {[[PromiseState]]: "fulfilled" , [[PromiseResult]]: undefined}
      }
      var newPromise = fn(); // newPromise : {[[PromiseState]]: "fulfilled" , [[PromiseResult]]: 10}
    • fn 返回 Promise 对象
      async function fn() {
          return new Promise((resolve, reject) => {
              setTimeout(() => {resolve("syy")}, 3000)
          })
      }
      fn().then(res => { console.log(res); }); // syy , fn内部promise中的异步代码代码执行完成之后才会调用then方法的回调函数

  2、async 函数内部抛出错误,会导致返回的 Promise 对象变为 rejected 状态,抛出的错误对象会被 catch 方法回调函数接收到

// 抛错方式一、
async function getData(){
    throw new Error('出错了');
}
getData().catch(e=> console.log(e) );//Error: 出错了

// 抛错方式二、
async function getData2(){
    return Promise.reject('出错了'); 
}

  3、async 函数内部所有 await 命令后面的代码执行完,才会返回,除非遇到 return 语句或者抛出错误。

async function f() {
    await Promise.reject('出错了');//不会往下执行了
    await Promise.resolve('hello world');   
    ....
}   
console.log(f()); // {[[PromiseState]]: "rejected" , [[PromiseResult]]: "出错了"}

 

await 关键字介绍

   1、await 用于 async 函数内部 ; 会阻塞js代码 ;

    •   如果 await 后面是一个基本类型值,那 await 表达式的运算结果就是后面的结果
      var p = await 3 + 5; // p = 8

    •   如果 await 后面是 Promise 对象:当前 promise 变成 fulfilled 或 rejected 后,语句才会往下执行;
      async function fn() {
          return new Promise((resolve, reject) => {
              setTimeout(() => { resolve("syy") }, 3000)
          })
      }
      async function test() {
          var p = await fn();
          console.log(p); // syy
      };
      test();

 

  2、可以将第一个 await 放在 try...catch 结构里面,这样不管这个异步操作是否成功,第二个await都会执行  

async function f() {
  try {
      await Promise.reject('出错了');
  } catch(e) {
  }
  return await Promise.resolve('hello world');
}
f().then(v => console.log(v))  //hello world

 

  3、如果 await 后面的异步操作出错,那么等同于 async 函数返回的 Promise 对象被 reject

async function f() {
    await new Promise(function (resolve, reject) {
        throw new Error('出错了');
    });
}
f().catch(e => console.log(e))  //Error:出错了

 

  4、多个 await 命令后面的异步操作,如果不存在继发关系,最好让它们同时触发

let foo = await getFoo();
let bar = await getBar();
//上面代码中,getFoo和getBar是两个独立的异步操作(即互不依赖)。这样比较耗时,因为只有getFoo完成以后,才会执行getBar,完全可以让它们同时触发
let [foo, bar] = await Promise.all([getFoo(), getBar()]);

 

  •  
      


标签:function,resolve,await,Promise,async,fn
From: https://www.cnblogs.com/zzAyy/p/16664710.html

相关文章