async await

概念：是generator函数的语法糖，让异步操作更加方便,实际上是promise和yield的结合体

用法：

async  function 函数名(){

await 语句

}

与generator的区别

1.*星号换成async ,yield换成await,await只能用在async函数里

2.返回值为Promise对象可使用.then方法继续操作，generator对象返回值为迭代器对象使用.next方法输出结果

3.遇到await后先返回，等异步操作完成后，继续执行函数体内后面的语句

一：若不加await则返回的是promise对象

 async function test1(x) {
            let a=1
            let b=2
            return a+b+x
        }
        console.log(test1(10))//Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 13}

二：.then方法（async里的return语句会作为then里的参数传递到then方法里）

 async function f() {
            return await 123;
        }
        f().then(v => console.log(v))//输出123

注意：当await语句后面的Promise变为reject，即使前面没有return，依然传参到catch回调里

且reject后面的语句中断执行

 async function f() {
            await Promise.reject('出错了');
            await Promise.resolve('hello world'); // 不会执行
        }
        f().then(v => console.log(v)).catch(e => console.log(e))// 出错了

延时5s输出hello

一：promise

 const timeout=()=>{
           return new Promise((resolve,reject)=>{
               setTimeout(()=>{
                   return resolve('hello')
               },5000)
           })
        }
        timeout().then((value)=>console.log(value))

二：async await

async function test() {
  return await new Promise((resolve, reject) => {
    setTimeout(() => {
      return resolve('hello world');
    }, 5000)
  });
}
test().then((value) => console.log(value));

注意：

当遇到多个异步操作即多个await，会按顺序完成

let foo = await getFoo()
let bar = await getBar()
上面的代码只有getFoo完成，才会去执行getBar，这样会比较耗时。如果这两个是独立的异步操作，完全可以让它们同时触发。

//写法一

let [foo, bar] = await Promise.all([getFoo(), getBar()])

//写法二

let fooPromise = getFoo()let barPromise = getBar()let foo = await fooPromiselet bar = await barPromise