jQuery.Callbacks一般開發者接觸的很少,雖然jQuery向開發者提供了外部接口調用,但是$.Callbacks()模塊的開發目的是為了給內部$.ajax() 和 $.Deferred()模塊提供統一的基本功能組件。它可以用來作為類似基礎定義的新組件的功能。
jQuery.Callbacks是jquery在1.7版本之后加入的,是從1.6版中的_Deferred對象中抽離的,主要用來進行函數隊列的add、remove、fire、lock等操作,并提供once、memory、unique、stopOnFalse四個option進行一些特殊的控制。
這個函數常見的應用場景是事件觸發機制,也就是設計模式中的觀察者模式的發布、訂閱機制,目前Callbacks對象用于queue、ajax、Deferred對象中,本小節主要是一些簡單的例子去理解的使用。
我們看官網提供的demo:
function fn1(value) {
console.log(value);
}
function fn2(value) {
fn1("fn2 says: " + value);
return false;
}
可以將上述兩個方法作為回調函數,并添加到 $.Callbacks 列表中,并按下面的順序調用它們:
var callbacks = $.Callbacks();
callbacks.add(fn1);
// outputs: foo!
callbacks.fire("foo!");
callbacks.add(fn2);
// outputs: bar!, fn2 says: bar!
callbacks.fire("bar!")
這樣做的結果是,當構造復雜的回調函數列表時,將會變更很簡單??梢愿鶕枰芊矫娴木涂梢韵蜻@些回調函數中傳入所需的參數。
上面的例子中,我們使用了 $.Callbacks() 的兩個方法: .add() 和 .fire()。 .add() 和 .fire() .add() 支持添加新的回調列表, 而.fire() 提供了一種用于處理在同一列表中的回調方法的途徑。
另一種方法是$.Callbacks 的.remove()方法,用于從回調列表中刪除一個特定的回調。下面是.remove()使用的一個例子:
var callbacks = $.Callbacks(); callbacks.add( fn1 ); // outputs: foo! callbacks.fire( "foo!" ); callbacks.add( fn2 ); // outputs: bar!, fn2 says: bar! callbacks.fire( "bar!" ); callbacks.remove( fn2 ); // only outputs foobar, as fn2 has been removed. callbacks.fire( "foobar" );
這個運用內部就是觀察者模式的一種設計實現,只是相對比較復雜。我們看看jQuery的回調函數到底為哪些模塊服務?
異步隊列模塊:
Deferred: function(func) {
var tuples = [
// action, add listener, listener list, final state
["resolve", "done", jQuery.Callbacks("once memory"), "resolved"],
["reject", "fail", jQuery.Callbacks("once memory"), "rejected"],
["notify", "progress", jQuery.Callbacks("memory")]
],………….
隊列模塊
_queueHooks: function(elem, type) {
var key = type + "queueHooks";
return data_priv.get(elem, key) || data_priv.access(elem, key, {
empty: jQuery.Callbacks("once memory").add(function() {
data_priv.remove(elem, [type + "queue", key]);
})
});
}
Ajax模塊
ajax: function(url, options) {
//省略代碼
deferred = jQuery.Deferred(),
completeDeferred = jQuery.Callbacks("once memory")
..............
}
不難發現jQuery.Callbacks還提供“once memory”等參數用來處理:
? once: 確保這個回調列表只執行( .fire() )一次(像一個遞延 Deferred)。
? memory: 保持以前的值,將添加到這個列表的后面的最新的值立即執行調用任何回調 (像一個遞延 Deferred)。
? unique: 確保一次只能添加一個回調(所以在列表中沒有重復的回調)。
? stopOnFalse: 當一個回調返回false 時中斷調用。
var callbacks = $.Callbacks('once');
callbacks.add(function() {
alert('a');
})
callbacks.add(function() {
alert('b');
})
callbacks.fire(); //輸出結果: 'a' 'b'
callbacks.fire(); //未執行
once的作用是使callback隊列只執行一次。
OK,我們大概知道這個是干嘛用的了,可以開始上正菜了,(下一節開始噢?。?/p>
請驗證,完成請求
由于請求次數過多,請先驗證,完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報