JS_是時候使用promise了

894974231 發(fā)布于2019-08-22 15:16 / 3036人閱讀

摘要：如果對象已經(jīng)處于狀態(tài)，調(diào)用方法會立即執(zhí)行回調(diào)函數(shù)。好多庫中實現(xiàn)叫，對象是用來操作對象修改對象狀態(tài)，而對象本身只提供方法添加回調(diào)函數(shù)以及其他添加回調(diào)函數(shù)的方法，不提供操作對象的方法，這樣設(shè)計使得對象對外不可修改，詳細(xì)參考實現(xiàn)。

1. 異步編程

JS是單線程執(zhí)行了，通過event loop實現(xiàn)了非阻塞的I/O。編程中經(jīng)常用異步回調(diào)函數(shù)的方式處理I/O的反饋結(jié)果（網(wǎng)絡(luò)請求，用戶交互事件）。如分別發(fā)送兩個請求：

function xhrRequest(url, callback) {
    setTimeout(function(){ // 用setTimeout模擬異步請求
        callback();
    }, 0)
}

xhrRequest("/index", function(){
    console.log("request /index done");
})
xhrRequest("/list", function(){
    console.log("request /list done");
})

但如果想在請求index后再請求list怎么辦呢？，可能會這樣寫：

xhrRequest("/index", function(){
    console.log("request /index done");
    xhrRequest("/list", function(){ // 回調(diào)函數(shù)里，再次回調(diào)
        console.log("request /list done");
    })
})

但是如果有3個或4個異步請求有先后依賴怎么呢？回調(diào)函數(shù)會一直嵌套回調(diào)函數(shù)（callback hell），代碼看起來亂糟糟的，并且不好維護。事件模式也不能很好處理這些，急需其他能降低異步編程復(fù)雜性的方式。

2. promise模式 2.1 promise A+

Promise已經(jīng)是個標(biāo)準(zhǔn)了，最新的是Promise A+標(biāo)準(zhǔn)。標(biāo)準(zhǔn)中給Promise的定義是："A promise represents the eventual result of an asynchronous operation"。即Promise表示一個異步操作的最終結(jié)果。主要通過Promise對象的then方法和Promise對象進行交互：注冊失敗，成功回調(diào)函數(shù)，并且失敗回調(diào)函數(shù)接收一個失敗原因(reason)參數(shù)，成功回調(diào)函數(shù)接收一個值（value）參數(shù)。Promise A+標(biāo)準(zhǔn)主要是定義then方法的規(guī)范。

2.1.1 Promise對象狀態(tài)

Promise對象有三種狀態(tài)：Pending（待定），F(xiàn)ullfilled（已完成），Rejected（已拒絕）。
A：Pending的Promise對象可以轉(zhuǎn)成Fullfilled或者Rejected
B：Fullfilled的Promise對象不能轉(zhuǎn)成其他狀態(tài)，并且必須含有一個值（value），該值不能變。
C：Rejected的Promise對象不能轉(zhuǎn)成其他狀態(tài)，并且必須含有一個原因?qū)ο螅╮eason）表示失敗的原因，該值不能變。

2.1.2 then(onFullfilled, onRejected)方法

then方法的規(guī)范很多，認(rèn)真讀讀標(biāo)準(zhǔn)。但要主要下面幾點：
A：每個回調(diào)函數(shù)只能執(zhí)行一次。
B：多次調(diào)用then方法，可以注冊多個回調(diào)函數(shù)，回調(diào)函數(shù)的調(diào)用順序取決于調(diào)用then方法的順序。如果Promise對象已經(jīng)處于fullfilled/ rejected狀態(tài)，調(diào)用then方法會立即執(zhí)行onfullfilled/onRejected回調(diào)函數(shù)。
C：then方法必須返回個Promise對象： Promise2 = Promse1.then(onFullfilled, onRejected)。但沒規(guī)定Promise1和Promise2是否相等，這個要看具體的實現(xiàn)了。

2.1.3 then鏈

then方法返回一個Promise對象，這樣就構(gòu)成一個then鏈。前面的Promise對象的狀態(tài)變化對后面的Promise對象的狀態(tài)的影響稱為Promise解決程序（The Promise Resolution Procedure）。

2.2 Promise標(biāo)準(zhǔn)實現(xiàn)

實現(xiàn)Promise標(biāo)準(zhǔn)的庫和框架有很多了，jQuery，Zeptojs，ES6等。好多庫中Promise實現(xiàn)叫Deferred，Deferred對象是用來操作Promise對象（修改Promise對象狀態(tài)），而Promise對象本身只提供then方法添加回調(diào)函數(shù)（以及其他添加回調(diào)函數(shù)的方法），不提供操作Promise對象的方法，這樣設(shè)計使得Promise對象對外不可修改，詳細(xì)參考ZeptoJS Deferred實現(xiàn)。

2.3 為什么Promise模式重要

Promise是把類似的異步處理對象和處理規(guī)則進行規(guī)范化，并按照采用統(tǒng)一的接口來編寫，而采取規(guī)定方法之外的寫法都會出錯。這樣更有利理解，維護。將復(fù)雜的異步處理輕松地進行模式化。

參考

異步編程

Promise A+標(biāo)準(zhǔn)

promises 很酷，但很多人并沒有理解就在用了