async和await

promise链

原来用promise的链式调用方式,then 中原本就返回了一个promise

new Promise(function(resolve, reject) {
  setTimeout(() => resolve(1), 3000); // (*)
}).then(function(result) { // (**)
  console.log(result); // 1
  return result * 2;   // 将返回的promise状态改为resolved 
}).then(function(result) { // (***)
  console.log(result); // 2
  return result * 2;
}).then(function(result) {
  console.log(result); // 4
  return result * 2;
});

   
   

async

函数前面的async一词意味着一个简单的事情：这个函数总是返回一个promise，如果代码中有return <非promise>语句，JavaScript会自动把返回的这个value值包装成promise的resolved值;调用就像普通函数一样调用,但是后面可以跟then()了

async function fn() {
    return 1
}
fn().then(alert) // 1

   
   

也可以显式的返回一个promise，这个将会是同样的结果：

async function f() {
  return Promise.resolve(1)
}
f().then(alert) // 1

   
   

async确保了函数返回一个promise，即使其中包含非promise。

await

await只能在async函数里使用,它可以让JavaScript进行等待，直到一个promise执行并返回它的结果，JavaScript才会继续往下执行.
await 可以用于等待的实际是一个返回值,可是promise的返回值,也可以是普通函数的返回值,或者使一个变量, 注意到 await 不仅仅用于等 Promise 对象，它可以等任意表达式的结果，所以，await 后面实际是可以接普通函数调用或者直接变量的。

注意 :await不能在常规函数里使用await,不能工作在顶级作用域,只能在async函数中使用,

定义一个await
let  value = await promise  // value 可以得到promise成功后返回的结果, 然后才会继续向下执行

    
    

async function f() {    // await 只能在async函数中使用
    let promise = new Promise((resolve, reject) => {
        setTimeout(() => resolve('done!'), 1000)
    })
    let result = await promise   //  直到promise返回一个resolve值（*）才会执行下一句
    alert(result) // 'done!' 
}
f()

   
   

function getSomething() {
    return "something";
}
async function testAsync() {
    return Promise.resolve("hello async");
}
const xxx = {a:1,b:2}
async function test() {
    const v1 = await getSomething();   // await 后跟普通函数的返回值
    const v2 = await testAsync();     // await 后跟异步函数的返回值
    const v3 = await  xxx
    console.log(v1, v2,v3);
}
test();

   
   

一个class方法同样能够使用async，只需要将async放在实例方法之前就可以,它确保了返回值是一个promise，支持await.如下:

class Waiter {
   async wait () {
       return await Promise.resolve(1)
   }
}
new Waiter().wait().then(alert) // 1

    
    

await的异常处理

多个await连续时,会一个一个同步执行,如果中间有一个reject了,就会停止后面的代码执行,所以需要用 try...catch处理错误
用try/catch 来捕获异常，把await 放到 try 中进行执行，如有异常，就使用catch 进行处理。

 async getFaceResult () {
       try {
          let location = await this.getLocation(this.phoneNum);
           if (location.data.success) {
                   let province = location.data.obj.province;
                    let city = location.data.obj.city;
                    let result = await this.getFaceList(province, city);
                    if (result.data.success) {
                       this.faceList = result.data.obj;
                   }
               }
       } catch(err) {
            console.log(err);
       }
 }