ES6 async和await

async和await

• 同样是进行异步操作的重要方法，与Promise对象有莫大的关系；
• async 写在函数前，声明该函数为 async函数；
• await 后面跟表达式，但一般只使用在 Promise对象；
• async 和 await 一般是联合使用
• async 和 await 两种语法结合可以让异步代码像同步代码一样执行

async 函数

1. async 函数的返回值是一个 Promise 对象

   // async函数
   async function fu(){
      return "Hello World!";
   }
   
   let result = fu();
   console.log(result);
   

2. 返回 Promise 对象的状态由 async 函数执行后的返回值决定

• 只要返回值不是一个Promise对象，那么返回的结果就是一个成功的Promise对象，包括没有返回值的状态

  // async函数
  async function fu(){
      
     	// return 123;
     // return "Hello World!";
     return;
  }
  
  let result = fu();
  console.log(result);
  

  • 如果 async函数中抛出了一个错误，那么返回的结果就是一个失败的Promise

  async function fu(){
      // 抛出一个错误，返回的结果是一个失败的 Promise
  	throw new Error("出错了！");
  }
  
  let result = fu();
  console.log(result);
  

  • 如果返回的结果是一个Promise对象，那么函数返回的 Promise的状态将由返回值的 Promise对象的状态决定（貌似有些绕口）

  async function fu(){
      // 返回的结果是一个失败的 Promise对象
  	return new Promise((resolve,reject)=>{
          // 设置状态为成功
         resolve('成功返回的数据');
          
          // 设置状态为失败
          reject("失败的错误");
      });
  }
  
  let result = fu();
  console.log(result);
  

  • async 函数返回的 Promise对象，同样可以调用 then方法，来处理当前对象的状态

  async function fu(){
      // 返回的结果是一个失败的 Promise对象
  	return new Promise((resolve,reject)=>{
          // 设置状态为成功
         resolve('成功返回的数据');
          
          // 设置状态为失败
          reject("失败的错误");
      });
  }
  
  let result = fu();
  
  // 调用 then方法
  result.then(value => {
      console.log(value);
  }, reason =>{
      // 换一种显示方式
      console.warn(reason);
  })
  

await 表达式

1. await必须写在async函数中

   • await要放在async函数中，但是async可以没有await

2. await右侧跟的是表达式，但一般为 Promise对象

   1. await 表达式存在返回结果，它的结果就是Promise成功时返回的值；

   2. await的Promise失败了，就会抛出异常，需要通过try…catch捕获处理;

   // 创建Promise对象
   const pro = new Promise((resolve,reject)=>{
       resolve("成功的值");
   });
   
   async function main(){
      let result = await pro;
       
       console.log(result);
   }catch(e){
       console.log(e);
   }
   
   // 调用函数
   main();
   

这里是万物之恋，我们下次再见了！