從設(shè)計的層面上來考下，這種事件組合的方式是如何實現(xiàn)？有什么優(yōu)勢？

1. Ajax 的參數(shù)回調(diào)
2. 基于 deferred 方式的 done 回調(diào)
3. 全局的自定義事件的回調(diào)

設(shè)計一：

tAjax({
    url: "php.html",
    complete: function(data) {
        console.log(data)
    }
})

如果要實現(xiàn)這種接口調(diào)用那么我們就需要封裝下代碼，把回調(diào)通過實參傳遞。

var tAjax = function(config) {
 //參考右圖設(shè)計一
}

這樣設(shè)計可以看做類似工廠模式的封裝，好處不用多說在工廠模式里面包含了對象的創(chuàng)建等必要的邏輯，客戶端根據(jù)傳參選擇動態(tài)的實例化相對的處理，對于客戶端來去除了具體的依賴，當(dāng)然 tAjax 你也可以看作一個外觀模式提供的接口，其實就是隱藏了具體的復(fù)雜邏輯，提供一個簡單的接口，從而降低耦合。

設(shè)計二：

tAjax({
    url: "php.html",
    complete: function(data) {
        console.log(data)
    }
}).done(function(data){
    console.log(data)
})

在之前加入了一個 done 鏈?zhǔn)教幚?，?dāng)然這里 done，其實是 deferred 的一個成功處理通知，如果之前沒有接觸，大家去了解一下關(guān)于 deferred 的概念，我們知道 jQuery 實現(xiàn)了鏈?zhǔn)?，實現(xiàn)的原理無法就是返回本身對象的引用。

var ajax = tAjax({
    url: "php.html",
    complete: function(data) {
        console.log(data)
    }
})
ajax.done(function(){
    //.........
})

以上是分離的情況下，如果要合并成一條鏈?zhǔn)教幚恚灰谏弦粋€方法中返回 this 即可。

var tAjax = function(config) {
   ///參考右圖設(shè)計二
    return {
        done: function(ourfn) {
             doneFn = ourfn;
        }
    }
}

我們返回了一個 done 對象，這里一樣要是對象，因為鏈?zhǔn)降脑蛭覀兛赐獠恐付藘?nèi)部的 done，從而把外部函數(shù)給引用到內(nèi)部的 doneFn 上緩存起來 xhr.staturs 成功后一起執(zhí)行，當(dāng)然這種設(shè)計是有問題的，如果在 done 之后我再鏈?zhǔn)骄涂隙ú恍校驗閷ο蟮囊缅e了，那么 jQuery 是如何處理？

設(shè)計三：提供 document 對象的全局處理

$(document).ajaxComplete(function() {
    console.log('ajax請求成功')
})
tAjax({
    url: "php.html",
    complete: function(data) {
         console.log(data)
    }
}).done(function(data){
    console.log(data)
})

• 這里的問題就是把 ajax 內(nèi)部的事件，返回給全局捕獲了，有點類似 css3 的全局動畫事件
• 這里的設(shè)計其實最簡單了因為本身之間沒有什么耦合，就是發(fā)送一個事件給 document 即可
• jQuery 利用了 trigger 自定義事件觸發(fā)的globalEventContext.trigger("ajaxComplete", [jqXHR, s]);
• 具體每一種實現(xiàn)在后面的都會提到，在這里需要大家有個整體的印象