Promise 運行機制

本文將整理一下自己對Promise（）運行機制的簡單理解：

（一）promise()是對 ajax異步請求執行邏輯的梳理（異步請求串行）

　　先看一下ajax請求的異步處理：

request.onreadystatechange = function(){
    if (request.readyState === 4) {
        if (request.status === 200) {
            return success(request.responseText);
        } else {
            return fail(request.status);
        }
    }
}

　　作為開發我們都曾有過異步引起的痛點——異步還沒執行完，頁面已經渲染完了，所以頁面數據和接口數據不同步、事件明明已經綁定了，但是click都是沒有效果，發型換了好幾個，都沒有發現是什么問題，原來只是事件綁定的時候，頁面還有渲染（反正剛開始我經常犯這種錯誤），尤其對於剛入門的小白，還沒有很透徹的理解異步到底是怎么一回事，就更摸不到頭腦了，必定我們的思維習慣是順序執行，對於這個問題JQuery框架封裝的ajax請求中callback函數已經解決了大部分問題。但是你是否想過，如果這樣寫會更容易理解：

var ajax = Get('../resquest/url);
ajax.ifSuccess()//執行成功之后約定的回調函數
      .ifFail()    //執行失敗之后約定的回調函數

　　而Promise的出現，讓異步請求的執行更加語義化，它將異步請求串行，開始只關注異步請求，承諾（promise）在后面處理請求結果，從此再也不擔心異步問題了。

new Promise(function () {
    //異步函數執行過程
}).then(function (r) {
    log('Done: ' + r);//成功回調
}).catch(function (reason) {
    log('Failed: ' + reason);//失敗回調
});

　（二）使異步請求並行（all）

　　使用promise.all（），同時進行多個異步請求

var p1 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 500, 'P1');
});
var p2 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 600, 'P2');
});
// 同時執行p1和p2，並在它們都完成后執行then:
Promise.all([p1, p2]).then(function (results) {
    console.log(results); // 獲得一個Array: ['P1', 'P2']
});

　（三）用於容錯（race）

var p1 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 500, 'P1');
});
var p2 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 600, 'P2');
});
Promise.race([p1, p2]).then(function (result) {
    console.log(result); // 'P1'
});

如p1請求先響應，.then()就先用p1的結果，p2仍然在執行，但是結果被廢棄。

以上便是我對Promise（）一些簡單理解，希望可以幫到你~

參考博文：https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014345008539155e93fc16046d4bb7854943814c4f9dc2000