async/await

async 的用法

async 它作为一个关键字放到函数前面，用于表示函数是一个异步函数，异步函数意味着该函数的执行不会阻塞后面代码的执行

下面是一个async函数，直接加括号调用就可以了。

    async function test() {
        return 'Hello World';
    }
    console.log(test());
复制代码

查看控制台，函数返回是一个 promise 对象，我们获取到了 Hello World，同时没有阻塞后面代码的执行。

    async function test() {
        return 'Hello World';
    }
    test().then(res => {
        console.log(res); // Hello World
    });
    console.log('先执行');
复制代码

可以注意到，上面控制台中的 Promise 有一个 resolved，这是 async 函数内部的实现原理。如果async 函数中有返回一个值，当调用该函数时，内部会调用 Promise.resolve() 方法把它转化成一个promise 对象作为返回，如果函数内部抛出错误的时候，就会调用 Promise.reject() 返回一个promise 对象。

     async function test(flag) {
         if (flag) {
             return 'Hello World';
         } else {
             throw 'Oh my god';
         }
     }
     console.log(test(true)); // 调用Promise.resolve() 返回promise对象。
     console.log(test(false)); // 调用Promise.reject() 返回promise对象。
复制代码

如果函数内部抛出错误， promise 对象有一个catch 方法进行捕获。

     test().catch(err => {
         console.log(err);
     });
复制代码

await 的用法

await 意思是 async/wait(异步等待)。这个关键字只能在使用async定义的函数里面使用。任何async 函数都会默认返回 promise，并且这个 promise 解析的值都将会是这个函数的返回值，而async 函数必须等到内部所有的 await 命令的 Promise 对象执行完，才会发生状态改变。

     function getResult(num) {
         return new Promise((resolve, reject) => {
             setTimeout(() => {
                 resolve(num * 10);
             }, 2000);
         } )
     }
 
     async function testResult() {
         let result  = await getResult(2);
         console.log(result);
     }
 
     testResult(); // 2s之后输出 20
复制代码

代码的执行过程：调用 testResult 函数，遇到 await 之后，代码就暂停执行了，等待getResult(2) 执行完毕，getResult(2) 返回的 promise 开始执行，2s 之后，promise resolve 了，并返回了值为 20，这时 await 才拿到返回值 20，然后赋值给 result，暂停结束，代码才开始继续执行，执行 console.log 语句。