js promise看這篇就夠了

1、背景

　　你們都知道nodejs很快，爲何會這麼快呢，緣由就是node採用異步回調的方式來處理須要等待的事件，使得代碼會繼續往下執行不用在某個地方等待着。可是也有一個很差的地方，當咱們有不少回調的時候，好比這個回調執行完須要去執行下個回調，而後接着再執行下個回調，這樣就會形成層層嵌套，代碼不清晰，很容易進入「回調監獄」，就容易形成下邊的例子：

async(1, function(value){
  async(value, function(value){
    async(value, function(value){
      async(value, function(value){
        async(value, function(value){
          async(value, final);
        });
      });
    });
  });
});

　　這樣的寫法會讓人崩潰，那麼有什麼辦法能夠解決這個問題呢，或者有其餘別的寫法嗎？答案是有的，es6新出的promise對象已經es7的async await均可以解決這個問題，固然這裏先介紹promise對象，es7的async await將在後邊的文章中分享。下邊未來介紹Promise對象。

2、簡介

　　Promise，他是一個對象，是用來處理異步操做的，可讓咱們寫異步調用的時候寫起來更加優雅，更加美觀便於閱讀。顧名思義爲承諾、許諾的意思，意思是使用了Promise以後他確定會給咱們答覆，不管成功或者失敗都會給咱們一個答覆，因此咱們就不用擔憂他跑了哈哈。因此，Promise有三種狀態：pending（進行中），resolved（完成），rejected（失敗）。只有異步返回的結構能夠改變其狀態。因此，promise的過程通常只有兩種：pending->resolved或者pending->rejected。

　　promise對象還有一個比較經常使用的then方法，用來執行回調函數，then方法接受兩個參數，第一個是成功的resolved的回調，另外一個是失敗rejected的回調，第二個失敗的回調參數可選。而且then方法裏也能夠返回promise對象，這樣就能夠鏈式調用了。接下來上代碼:

var Pro = function (time) {
            //返回一個Promise對象
            return new Promise(function (resolve, reject) {
                console.log('123');
                //模擬接口調用
                setTimeout(function () {
                    //這裏告訴Promise 成功了，而後去執行then方法的第一個函數
                    resolve('成功返回');
                }, time);
            })
        };
        (function(){
            console.log('start');
            Pro(3000)
            .then(function(data){
                console.log(data);
                return Pro(5000);})
            .then(function(data){
                console.log(data);
                console.log('end');
            })
        })();

　　上邊代碼中，定義了一個Pro變量，而後把一個匿名函數賦給他，函數返回一個Promise對象，而後對象裏邊接收一個函數，分別把resolve跟reject方法當參數傳進去，用setTimeOut來模擬異步請求，當執行resolve方法後就會調用then方法的一個函數。結果以下：

3、Promise 的api　

　　一、Promise.resolve()
　　二、Promise.reject()
　　三、Promise.prototype.then()
　　四、Promise.prototype.catch()
　　五、Promise.all() // 全部的都有完成，至關於 且
　　六、Promise.race() // 完成一個便可，至關於 或

　　一、Promise.resolve()的做用將現有對象轉爲Promise對象resolvedl;Promise.resolve('test')==new Promise(resolve=>resolve('test'))

　　二、Promise.reject()也是返回一個Promise對象,狀態爲rejected；

　　三、then方法上邊已經作介紹，這裏就再也不介紹。

　　四、catch():發生錯誤的回調函數。

　　五、Promise.all()適合用於全部的結果都完成了纔去執行then（）成功的操做。舉個例子：

let p1 =new Promise(function(resolve,reject){
            resolve(1);
        });
        let p2 = new Promise(function(resolve,reject){
            resolve(2);
        });
        let p3 = new Promise(function(resolve,reject){
            resolve(3);
        });
        Promise.all([p1, p2, p3]).then(function (results) {
            console.log('success:'+results);
        }).catch(function(r){
            console.log("error");
            console.log(r);
        });

最後輸出：

　　六、Promise.race()的做用也是同時執行多個實例，只要有一個實例改變狀態，Promise就改成那個實例所改變的狀態；

4、例子

        var Pro = function () {
            //返回一個Promise對象
            return new Promise(function (resolve, reject) {
                //模擬接口調用
                setTimeout(function () {
                    resolve(true);
                }, 1000);
            })
        };
        var Pro2 = function () {
            //返回一個Promise對象
            return new Promise(function (resolve, reject) {
                //模擬接口調用
                setTimeout(function () {
                    resolve('Pro2成功執行');
                }, 1000);
            })
        };
        
        Pro().then(function(data){
            var val = data;
            console.log(val)
            if (val) {
                console.log(1111)
                return Pro2()
            }
            
        }).then(function(data1){
            console.log(data1)
        })

輸出：

這樣就能夠用then方法能夠實現鏈式調用了。