理解並掌握Promise的用法

前沿： 

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

 

 

Promise知識要點： 

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

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

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

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

 

二、promise對象

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

2-一、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方法。

　　特別提示：

　　一、then方法 的 onrejected 處理方法和catch方法只是語法糖不一樣。實際上是一個東西。 

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

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

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

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

 

 

三、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函數的返回值被忽略。

 

 

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

　　個人理解是，只要準確的把握promise的狀態變化狀況，就能運用好promise。

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

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