Promise 的鏈式編程--異步編程的一種解決方案

Promise 異步編程的一種解決方案，比傳統的解決方案（回調函數和事件）更合理強大

1.promise 構造函數接受一個函數作為參數，該函數有兩個參數resolve 和 reject （javascript 引擎提供）

2.resolve函數的作用是將promise 對象的狀態從未完成變成成功，即pending變成resolved，在異步操作成功時調用

3.reject函數的作用是將promise對象的狀態從未完成變成失敗，即pending變成rejected，在異步操作失敗時調用

廢話不多說，直接上代碼

<script>
  new Promise((resolve,reject)=>{
     setTimeout(()=>{ //第一次網絡請求
        resolve()
  },1000)   
}).then(()=>{
   console.log('hello');//第一次拿到結果
   console.log('hello');
   console.log('hello');
    return new Promise((resolve,reject)=>{
         setTimeout(()=>{ //第二次網絡請求
        resolve()
      },1000)   
        })
        }).then(()=>{
          console.log('helloVue');//第二次拿到結果
          console.log('helloVue');
          console.log('helloVue');
            return new Promise((resolve,reject)=>{
              setTimeout(()=>{ //第三次網絡請求
              resolve()
             },1000)   
          })
         })
        }).then(()=>{
            console.log('helloPython');
            console.log('helloPython');
        })

</script>

promise有三種狀態

pedding：等待中，初始狀態

fulfill：執行成功

reject：執行時發生錯誤

 

promise 鏈式調用

<script>
    new Promise((resolve,reject)=>{
         setTimeout(()=>{
               resolve('aaa')
        },1000)
      }).then(res=>{
          console.log(res,'first');
          return Promise resolve(res+'111')        
     })
     }).then(res=>{
         console.log(res,'second');
          return Promise resolve(res+'222') 
         })
        })
      }).then(res=>{
               console.log(res,'third');
         }

</script>

promise all 

<script>
 Promise.all([
     new Promise((resolve,reject)=>{
       $ajax({
           url:'url',
           success:function(data){
             resolve(data)
             }
            })
         })
       }),
       new Promise((resolve,reject)=>{
         $ajax({
          url:'url2',
          success:function(data){
            resolve(dataa)}
           })
         })
      ]).then(res=>{
        result[0]
        }