非同步操作系列之Promise物件

大猿猴發表於2018-11-26
非同步Promise物件

Promise定義

一個物件，用於傳遞非同步操作的訊息。通過new關鍵字建立例項。

Promise特點

  • 狀態封閉性。狀態不受外界改變，只有非同步操作結果可以決定當前的狀態。共3種狀態，分別是Pending、Resolved和Rejected。 只有兩種狀態改變，即從Pending變為Resolved以及從Pending變為Rejected。

  • 狀態不變性。一旦狀態改變就不會再變，一直保持這個結果。比如一個Promise物件的狀態已經為Resolved，根據狀態不變性，再在主執行緒中拋錯是無效的。

  • 狀態連鎖性。如果一個Promise例項傳遞了另一個Promise例項，那麼該例項會隨著要傳遞的Promise例項的狀態變化而變化。

建立Promise例項

var promise = new Promise(function(resolve,reject){
	var image = new Image();
    image.src = "https://www.baidu.com/img/bd_logo1.png";
    image.addEventListener("load",()=>{
         resolve(image);
    });
    image.addEventListener("error",()=>{
         reject(new Error("wrong..."));
    });
});
複製程式碼

說明：建立Promise例項時需要傳入一個函式，傳入的函式帶有resolve函式引數和reject函式引數，這兩個引數由JS引擎提供。resolve函式會將Promise物件從Pending狀態轉為Resolved狀態，並在操作成功時將非同步操作結果作為引數傳遞出去；而reject函式會將Promise物件從Pending狀態轉為Rejected狀態，並在操作失敗時將錯誤物件傳遞出去。

Promise API

1. then(successCallback[,errorCallback])

  • 作用：當狀態改變時進行回撥處理
  • 引數：successCallback表示當非同步操作成功時被呼叫的回撥，errorCallback表示當非同步操作失敗時被呼叫的回撥。兩個回撥函式都將接收Promise物件傳出的值作為函式引數
  • 返回值：新的Promise例項，可通過鏈式呼叫需順序執行的操作

2. catch(callback)

  • 作用：相當於then(null,callback)，當非同步操作失敗時進行的回撥處理
  • 引數：callback表示非同步操作失敗時被呼叫的回撥
  • 返回值：新的Promise例項 ，不管有無被捕獲都會繼續執行接下來的方法

3. all(iterator)

  • 作用：將多個Promise例項包裝成一個新的Promise例項
  • 引數：迭代器物件，每個成員都是Promise物件
  • 返回值：新的Promise例項。當迭代器物件每個成員狀態均為resolved時，狀態為resolved，傳遞一個由各成員的返回值組成的陣列，否則狀態為rejected，傳遞第一個被rejected的成員的返回值

4.race(iterator)

基本同all方法，不同之處在於迭代器中任一成員的狀態發生變化，新例項的狀態也會隨之變化。

5.resolve([obj])

  • 作用：轉化為Promise物件，且狀態為resolved
  • 引數：任意物件。不傳遞引數時直接建立Promise物件
  • 返回值：新的Promise物件，並傳遞obj引數給回撥函式

6.reject(reason)

基本同resolve方法，不同之處在於返回的新的Promise物件的狀態為rejected

7.done([successCallback][,errorCallback])

  • 作用：保證丟擲任何可能出現的錯誤
  • 引數：同then方法引數
  • 返回值：新的Promise物件

8.finally(callback)

  • 作用：不管Promise物件最後狀態如何都會執行的動作
  • 引數：必須執行的回撥函式
  • 返回值：新的Promise物件

Promise 缺點

  • 一旦建立Promise例項就無法停止非同步操作
  • 當處於Pending狀態時無法得知進展到哪一階段(剛剛開始還是即將完成)

相關文章