async 与 await 的用法详解

概念

async用于声明function为异步方法，返回Promise实例，例如

async function fn(){
    console.log('async')
}

返回值

上面说到，async的返回值为promise对象，那么函数本身的返回值去哪了？熟知promise的同学都知道，promise的异步结果是通过then()或者catch()方法来获取并进一步处理。异步函数的返回值会当成resolve状态来处理，通过.then()来接收，而异步函数中出现的错误，则当成reject来处理，通过.catch()来捕获。同一时刻，只能处理其中一个状态，也就是resolve或者reject（也就是说函数要么处理成功，要么处理失败）。

await

顾名思义为“等待”意思，常与async搭配使用。

var value = await myPromise();

等待 其实就是指暂停当前 async function 内部语句的执行，等待后面的 myPromise() 处理完返回结果后，继续执行 async function 函数内部的剩余语句；myPromise() 是一个 Promise对象。

注意：await必须在async方法内部使用，其后如果跟随其他值，则直接返回该值，如果其后跟着的是Promise实例，则必须等到promise返回结果（即通过resolve或者reject处理的状态），否则后面的代码不会执行。注意：若返回reject状态，其后代码都不会执行。

async function fn() {
        console.log(1);
        var result = await new Promise(function (resolve, reject) {
            setTimeout(function () {
                console.log("2")
                resolve('result')

            }, 2000);
            console.log("我是setTimeout外的语句")//内部还是按照同步的顺序执行



        });
        console.log(3);//这下面的会等待result执行完之后再执行
        console.log(await 4); 
    }
    fn();
//输出
1
我是setTimeout外的语句
2 两秒后输出
3
4