异步编程async/await

async/await

使用 async 关键字可以让函数具有异步特征，但总体上其代码仍然是同步求值的。

async function foo() {
	console.log(1);
}

foo();
console.log(2);

异步函数如果使用 return 关键字返回了值（如果没有 return 则会返回 undefined），这个值会被 Promise.resolve()包装成一个Promise对象。

注：异步函数始终返回Promise对象！！

async function foo() {
	console.log(1);
	return 3;
}
// 给返回的Promise添加一个解决处理程序
foo().then(console.log);
console.log(2);
// 1
// 2
// 3

//等同于
async function foo() {
	console.log(1);
	return Promise.resolve(3);
}
// 给返回的Promise添加一个解决处理程序
foo().then(console.log);
console.log(2);
// 1
// 2
// 3

await

async 函数返回一个 Promise 对象，可以使用 then 方法添加回调函数。当函数执行的时候，一旦遇到 await 就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。

await关键字会暂停执行异步函数之后的代码，使其让出 JavaScript 运行时的执行线程，先执行异步。

1. async 单独使用的时候，放在函数前面表示这个函数是一个异步函数，如果 async 函数有返回结果，必须要用.then()方法来承接（也就是返回的值会被自动处理成 promise 对象）

   async function helloAsync(){
       return "helloAsync";
     }
     
   console.log(helloAsync())  // Promise {: "helloAsync"}
    
   helloAsync().then(v=>{
      console.log(v);         // helloAsync
   })
   

2. async await 搭配使用的时候，await 是等待此函数执行后，再执行下一个，可以把异步函数变成同步来执行，控制函数的执行顺序。

   • 当 await 后跟的函数是返回的 promise

     let foo = () => {
       return new Promise(resolve => {
         setTimeout(() => {
           console.log('lee');
           resolve();
         }, 1000);
       });
     };
     
     async function bar() {
       await foo();		
       console.log('van');
     }
     console.log(bar()); // 隔1秒同时输出 lee van
     

   • 当 await 后跟的是普通函数（非 promise()）

     let f1 = () => {
       setTimeout(() => {
         console.log('lee');
       }, 1000);
     };
     
     let f2 = () => {
       setTimeout(() => {
         console.log('van');
       }, 1000);
     };
     
     async function bar() {
       await f1();
       await f2();
       console.log('yeah');
     }
     
     console.log(bar()); // yeah 隔1秒同时输出 lee fan