异步处理 async & await & promise 解析

promise

promise 用来处理异步回调；
优点：代码风格清晰明了 ，不需要层层嵌套callback

promise的3种状态

待定：初始状态，既未实现也不被拒绝。
完成：表示操作成功完成。
拒绝：表示操作失败。

promise只有两条路
待定------->完成
待定------->拒绝
当状态改变的时候 ，出发then();

promise 的两个参数 resolve，rejuect

Promise数据处理成功叫给resolve处理；
Promise会自动捕获内部异常，并交给rejected响应函数处理。

假设有三个这样接口方法，我们要获取到最后的age属性，用promise 可以这样写：

getId(){//获取id 的接口
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('37092119910201')
     },3000)
   })
 }
 getName(id){//通过id 查找 Name
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('LuChao')
     },3000)
   })
 }
 getAge(Name){//通过偶Name 查找Age
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('18')
     },3000)
   })
 }

这样调用：

 getId().then(id=>{
    // console.log("id----->",id)
    getName(id).then(name=>{
        // console.log("name----->",name);
        getAge(name).then(age=>{
          console.log('age------>',age)
        })
    })
  })

async 和 await

async , await 其实就是promise的语法糖，实际上 async 和await 在编译后 ，会转化成promise
上述这种实现 用 async 和 await 会更简洁更清晰

 async getInfo(){
  let id = await this.getId();
  let name = await this.getName();
  let age = await this.getAge()
  console.log(age)
 }
getInfo()//18

这样的代码 可读性更强了。 变得更像是同步代码，简单清晰；

promise.all

我们修改一下 这个3个接口 ,修改成 后面2个接口 都可以通过id 获取到name，age；我们最后的需求是获取到 name，age；

getId(){//获取id 的接口
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('37092119910201')
     },3000)
   })
 }
 getName(id){//通过id 查找 Name
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('LuChao')
     },3000)
   })
 }
 getAge(Name){//通过偶id 查找Age
   return new Promise(resolveFun=>{
     setTimeout(()=>{
       resolveFun('18')
     },3000)
   })
 }

getId().then(id=>{
     Promise.all([getAge(id),getName(id)]).then(resArr=>{
       console.log(resArr)
     })
   })

Promise.all() 接收一个数组（一些异步方法，且以promise为返回值）；
Promise.all 会将这些promise方法，组合成一个大的promise，返回值是一个数组（resArr），
resArr包含了所有promise 的返回值；
当所有的子Promise都完成，该Promise完成，返回值是全部值得数组
有任何一个失败，该Promise失败，返回值是第一个失败的子Promise结果