理解並掌握Promise的用法

前沿： 

　　Promise在處理異步操作非常有用。項目中，與后端進行數據請求的時候經常要用到Promise。我們可以用promise + xhr進行ajax的封裝。也可以使用基於promise封裝的請求方法（fetch）或者類庫（axios）去跟服務器進行交互。當使用fethch或者axios的時候，常常需要對數據請求方法進行二次封裝。這就要求我們能夠理解並掌握promise的用法。

 

 

Promise知識要點： 

1、首先區分Promise構造函數和promise對象的概念。

　　通過Promise構造函數創建promise對象。promise對象是Promise構造函數的一個實例。

var promise1 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, 'foo');
});

console.log(promise1);
// output: [object Promise]

 

2、promise對象

　　概念（有點生硬）：promise 對象是一個代理對象（代理一個值），被代理的值在promise對象創建時可能是未知的。它允許你為異步操作的成功和失敗分別綁定相應的處理方法（handlers）。 這讓異步方法可以像同步方法那樣返回值，但並不是立即返回最終執行結果，而是一個能代表未來出現的結果的promise對象。換句話說，promise對象表示一個異步操作的最終狀態（完成或失敗），以及其返回的值。

2-1、promise的狀態類型

a.  一個 promise對象的狀態類型:

• pending: 初始狀態，既不是成功，也不是失敗狀態。
• fulfilled: 意味着操作成功完成。
• rejected: 意味着操作失敗。

b. promise對象狀態改變時，調用的方法。

　　要點：pending 狀態的 promise 對象可能觸發fulfilled 狀態並傳遞一個值給相應的狀態處理方法，也可能觸發失敗狀態（rejected）並傳遞失敗信息給相應的狀態處理方法。當其中任一種情況出現時，promise 對象的 then 方法綁定的處理方法（handlers ）就會被調用。then方法包含兩個參數：onfulfilled 和 onrejected，它們都是 Function 類型。

　　當promise狀態為fulfilled時，調用 then 的 onfulfilled 方法，當promise狀態為rejected時，調用 then 的 onrejected 方法或者catch方法。

　　特別提示：

　　1、then方法 的 onrejected 處理方法和catch方法只是語法糖不同。其實是一個東西。 

2-2. 如何進行鏈式操作

　　要點：Promise.prototype.then 和  Promise.prototype.catch 方法返回promise 對象， 並且將以回調的返回值來resolve。

　　1、即然then和catch方法調用后，返回一個新的promise對象（則可以進行鏈式調用了）。

　　2、新的promise對象初始狀態為pedding，以回調函數的返回值來resolve（不是reject），則狀態變為fulfilled。所以，再進行鏈式調用的時候是調用 then 的 onfulfilled 方法。（返回值為error或者回調拋出錯誤，狀態會變為rejected？？？有待考究下。在不發生意外情況，暫且理解為狀態只能變為fulfilled）

 

 

3、Promise 構造函數

　　要點：構造函數主要是用來包裝還未支持promises的函數。promise構造函數傳入一個帶有 resolve 和 reject 兩個參數的executor函數。executor函數。Promise構造函數執行時立即調用executor 函數， resolve 和 reject 兩個函數作為參數傳遞給executor（executor 函數在Promise構造函數返回新建對象前被調用）。resolve 和 reject 函數被調用時，分別將promise的狀態改為fulfilled（完成）或rejected（失敗）。executor 內部通常會執行一些異步操作，一旦完成，可以調用resolve函數來將promise狀態改成fulfilled，或者在發生錯誤時將它的狀態改為rejected。如果在executor函數中拋出一個錯誤，那么該promise 狀態為rejected。executor函數的返回值被忽略。

 

 

4、promise對象的狀態改變時機和值的傳遞

　　我的理解是，只要准確的把握promise的狀態變化情況，就能運用好promise。

　　1、由Promise構造函數創建的promise對象，狀態由Promise構造函數的executor函數去控制promise的狀態。調用executor函數的resolve或reject方法，把值傳遞下去。

　　2、當進行鏈式操作的時候，新的promise對象的狀態由上一個then或catch的回調函數去控制promise的狀態。用回調函數返回值的形式，把值傳遞下去。