非同步程式設計---Promise

林小刀發表於2018-10-24

JavaScript語言的執行環境是“單執行緒”。

所謂單執行緒,就是指一次只能執行一個任務,只有等執行完該任務,才能執行下下一個任務。簡而言之,就是要排隊,人人平等,先來後到,世界充滿和平。

但這裡有個問題,如果前面的任務需要花費的時間比較長,那後面的任務就只能乾等著(好浪費呀),於是就有了非同步程式設計。

非同步程式設計有4種方式,在這裡只講其中一種:Promise。

Promises物件是CommonJS工作組提出的一種規範,目的是為非同步程式設計提供統一介面

簡單說,它的思想是,將說有耗時比較久的任務作為非同步任務的回撥函式放到後面再執行,先執行完所有同步任務,再執行這部分非同步任務的回撥函式。

new Promise( function( resolve, reject) {
       //some code 
      if(//非同步操作成功){
        resolve(value);
         }else{
         reject(error);
         }
});複製程式碼

Promise建構函式接收一個函式作為引數,該函式的兩個引數分別是resolve和reject,他們是兩個函式,由Javascript引擎提供,不用自己部署。

resolve函式的作用是,將promise物件的狀態從“pending”變為‘’resolved‘’,在非同步操作成功時呼叫,並將非同步操作的結果,作為引數傳遞出去;

reject函式的作用是,將Promise物件的狀態從“未完成”變為“失敗”(即從 pending 變為 rejected),在非同步操作失敗時呼叫,並將非同步操作報出的錯誤,作為引數傳遞出去。

promise例項生成以後,可以用then方法分別指定resolved狀態和rejected狀態的回撥函式

舉個例子:前端請求一個介面,獲取通訊錄資料,然後渲染列表。在請求介面的時候可能因為資料量大而耗費的時間長,而渲染列表又是必須等拿回資料之後才能執行的。因此,我們可以使用promise非同步請求資料,將渲染方法作為回撥函式,先執行外部的同步函式,等拿到資料之後再執行。

function syncFunction(){
    return new Promise(function(resolve,reject){
    console.log("這是第一個非同步操作內部");
    let result = '這是請求回來的資料';
    resolve(result)
   })
}
syncFunction().then(function(result){
      console.log('這是第一個回撥函式')
})
    console.log('這是外部')複製程式碼

執行結果:

非同步程式設計---Promise

由上面的例子可以看出,syncFunction是個非同步方法,在執行了syncFunction()方法之後,並沒有馬上執行then()裡面的方法,而是執行了之後的console語句。等所有同步方法都執行完畢之後,才會執行then()裡的方法。


相關文章