es6语法 Promise和async/await 使用

Promise 作用

1. 主要用于异步计算
2. 可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果
3. 可以在对象之间传递和操作promise，帮助我们处理队列

三种状态

reslove 成功
reject 失败
pending初始状态

使用

  let fun1 = new Promise((reslove,reject)=>{
        setTimeout(()=>{       
            reslove()//成功状态
            console.log('fun1')           
        },1000)
  })
let fun2= new Promise((reslove,reject)=>{
           setTimeout(()=>{       
            console.log('fun2')
            reslove()          
           },3000)
      })
fun1().then(()=>{
     console.log('fun1方法执行完毕')
     fun2().then(()=>{
         console.log('fun2方法执行完毕')
    })
})
输出顺序:'fun1'>'fun1方法执行完毕'>'fun2'>'fun2方法执行完毕'

async 和await 的使用

async 异步 await 等待

  // 写在普通函数前面 表示这是一个处理异步的函数
   async function init(){
       await run5()    
       await run1() //等待当前函数执行完
       await run2()
       await run4()
       await run3()
     
    
   }
   init() //调用异步函数
 
   function run1(){
      setTimeout(()=>{
            console.log('1')                
        },1000)
   }
   function run2(){
     setTimeout(()=>{
          console.log('2')                
        },1000)
   }
   function run3(){
     setTimeout(()=>{
           console.log('3')                
       },1000)
   }
   function run4(){
       new Promise((reslove,reject)=>{
            console.log('4') 
            reslove() 
      })
   }
   function run5(){
     setTimeout(()=>{
            console.log('5')                
       },2000)
   }
   输出顺序:'5'>'1'>'2'>'4'>'3'

结论：Promise 配合 async/await使用：
1.主要解决普通异步函数的回调地狱问题
2.队列化执行使代码结构更加简洁清晰,便于维护，增加代码的可读性