promise(3) '靜態'方法

一直恐懼讀源碼，哪怕是一個簡單的庫也是讀百來行遇到難點就放棄了。對於新的東西也僅僅是知道它拿來幹什麼，社區資源在哪裏，要用時就突擊文檔資源使用便可。未有過深刻之心，亦或者有過深刻之心兩三天就廢掉。

這兩日安靜下來思考，以爲本身毛病很多，卻仍是不甘於平庸。那麼只能選擇面對本身作出改變，越是恐懼，越是應該面對。下一篇就來個es6-promise代碼理解好了。加油吧少年！

 3.1 Promise.reject()

Promise.reject()靜態方法,這個方法我在纔開始用的時候老迷惑了，不知道何時應該使用。直到我理解了then方法事後，就不迷惑了，接上一篇。看下圖代碼：

var aPromise = new Promise(function() {
    resolve(1)
});
var testPromise = aPromise.then(function onFulfilled() {
    //...一系列操做事後獲得要接受的value 值
    return value
})

//或者

var aPromise = new Promise(function() {
    reject(1)
});
var testPromise = aPromise.then(null, onRejected() {
    //...一系列操做事後獲得要接受的reason 值
    return reason
})

Promise.prototype.then執行它會返回一個新的promise對象,而這個新的promise對象的狀態值規則以下：

①var aPromise = new Promise(function(){ resolve(1)}); var testPromise = aPromise.then()//then沒有接收回調函數，新建立的testPromise 對象的[[PromiseStatus]]和[[PromiseValue]]與以前的aPromise 的同樣。

②then方法接收的回調函數執行return 值只爲普通對象或者原始類型，即將普通對象或者原始類型值賦給新建立的promise對象[[PromiseValue]],新建立的promise對象的[[PromiseStatus]]就等於調用then的那個promise對象的[[PromiseStatus]]。

③then方法接收的回調函數執行return值爲promise對象，即將promise對象的[[PromiseValue]]和[[PromiseStatus]]賦值給新建立的promise對象對應屬性值。

④then方法接收的回調函數執行return值爲thenable對象，即執行對象的then方法，根據then方法內部執行resolve或reject肯定[[PromiseValue]]和[[PromiseStatus]]，賦值給新建立的promise對象對應屬性值。

then函數最後調用了onRejected 或者 onFulfilled返回的promise對象須要把rejected狀態傳遞下去（傳遞給後續進行處理）此時須要使用Promise.reject。（舉個例子看下圖代碼）

// Request.get()是一個發起請求，當有數據返回或請求出錯時生成一個promise對象
// res爲後臺成功返回的數據，msg爲失敗或錯誤返回的數據
axios.get(url).then((res) => {
    if (res.code == 0) {
        //當code的值爲0 時斷定這個是成功的須要處理的數據
        return res;
    } else {
        //當code的值不爲0時，就須要返回一個rejected的promise對象供後續處理
        return Promise.reject(res));
    }
}, (msg) => {
    //一般是請求出錯須要返回一個rejected的promise對象，供後續處理
    return Promise.reject(msg);
});

 如圖中代碼，當須要把錯誤拋出給後續作處理的時候，一般會return  Promise.reject("緣由")給後續的代碼來處理(此時的錯誤能夠是咱們與後臺約定的錯誤碼，而不必定是代碼上的錯誤)。

Promise.reject()執行後返回的結果又是什麼了？

①reject,中不接收值時返回一個rejected狀態的promise對象[[PromiseValue]]值爲undefined

②reject中接收普通值和對象，會做爲返回的rejected狀態的promise對象的[[PromiseValue]]值。

//建立一個 thenable 對象
var thenable = {
    then(resolve, reject) {
        reject('錯誤緣由');
    }
};
//將 thenable 做爲參數使用
var testC = Promise.reject(thenable);
// 此處斷定 e 與  thenable
testC.catch(e => {
    console.log("我竟然是接受進來的thenable對象",e === thenable)
})

③reject中接收thenable 對象，直接做爲返回的rejected狀態的promise對象的[[PromiseValue]]值。（此處能夠在控制檯輸出testC，查看他的結構）

④reject中接收thenable 對象，直接做爲返回的rejected狀態的promise對象的[[PromiseValue]]值。（看上圖）

Promise.reject()方法接受的參數，會原封不動地做爲reject的理由，成爲新promise對象的[[PromiseValue]]值（厲害了一點轉化都不會作，廢話若是rejected狀態能夠變化，還要Promise.reject()有何有）。

總結：Promise.reject()返回一個使用接收到的值進行reject的新的promise對象。（promise對象是rejected的喲）

 3.2 Promise.resolve()

Promise.resolve 一個做用就是將 thenable 對象轉換爲promise對象。同理Promise.resolve 方法是建立promise對象的快捷方式。

thenable指的是一個具備 .then 方法的對象。目前咱們最多見的 thenable對象就是jQuery.ajax()

 1.當接受一個普通對象或值的時候

Promise.resolve返回的是一個將該對象做爲值的新promise對象。

2.接受一個thenable對象的時候

執行thenable的then方法，根據then方法內部執行resolve或reject肯定[[PromiseValue]]和[[PromiseStatus]]，而後將值賦給新的promise對象。

3.接收到promise對象參數的時候

返回的仍是接收到的promise對象

 3.3 Promise.all()

忽然想什麼場景下適合使用Promise.all，Promise.all簡單描述它接收一個 promise對象的數組做爲參數，當這個數組裏的全部promise對象所有變爲fulfilled或有對象變爲rejected狀態的時候，它就會去調用 .then 方法。

1.當接受到promise對象數組都fulfilled

Promise.all([testA，testB，testC]).then() ,接受的數組中testA，testB，testC會同時執行，promise對象只會狀態遷移一次，因此testA，testB，testC，有fulfilled狀態的就等待其餘的promise對象狀態遷移完成，而後在返回一個新的promise對象，then方法接受的參數是Promise.all接受到的promise對象resolve的值組成的數組，因此then接收的數組是相似[testAresolveValue, testBresolveValue, testCresolveValue]），數組順序跟接收的promise對象數組順序一致。

 

2.當接受到promise對象數組有rejected

Promise.all([testA，testB，testCReject]).then() ,它的執行跟前面場景一致，不一樣在數組中有promise對象rejected狀態就會執行.then方法。其它數組中還沒狀態遷移的promise對象還會執行，只是和後續的鏈式操做沒有什麼關係了。

 總結：Promise.all接受的數組，數組中的promise對象都fulfilled，Promise.all返回的新promise纔會是fulfilled狀態的，只要數組中有一個promise對象是rejected狀態，Promise.all返回的新promise會是rejected狀態的。可是數組中的promise對象都會狀態遷移到穩定（也就是說數組中有promise對象rejected狀態就會執行.then方法。但其它數組中還沒狀態遷移的promise對象還會執行的，好比上圖中"執行了C"是在"B：32"以後輸出的）;Promise.all 適用的場景是多個異步條件須要同時知足才執行後續操做的狀況。

 3.3 Promise.race()

Promise.race()跟Promise.all()使用方法一致，接收一個promise對象數組爲參數，但不一樣的是Promise.race()接收的promise對象數組中有一個promise對象進入 FulFilled 或者 Rejected 狀態的話，就會執行.then繼續進行後面的處理(就像比賽同樣誰先到達，誰就接着後續操做)。

第一個promise對象變爲肯定（FulFilled）狀態後，數組中其它的promise對象仍是會繼續運行的，全部手續輸出了「執行了：B」,「執行了：C」。

總結：Promise.race()接收的數組中的promise對象存在競爭關係，好比同時向兩個不一樣接口拿相同數據，哪一個接口先返回數據，就先使用該數據作後續操做。 也能夠作超時限制以下圖（附帶碼）。

function timeOut(time) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            reject('timeOut');
        }, time)
    })
}

function promiseURL(){
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            reject('get Date from promiseURL');
        }, 1000)
    })
}

Promise.race([promiseURL(), timeOut(2000)]).then(function(values) {
    console.log(values); // get Date from promiseURL
},function(res) {
    console.log(res); // timeOut  
})

 

 3.4 總結

終於把這篇結尾了，還好這個周時間充足，準備把前面兩篇修改整理一下，順帶作作es6-promise源代碼理解筆記。