W3Cschool
恭喜您成為首批注冊用戶
獲得88經驗值獎勵
一個多用途的回調列表對象,提供了強大的的方式來管理回調函數列表。
$.Callbacks()的內部提供了jQuery的$.ajax()?和?$.Deferred()?基本功能組件。它可以用來作為類似基礎定義的新組件的功能。
$.Callbacks()?支持的方法,包括?callbacks.add(),callbacks.remove(),?callbacks.fire()?and?callbacks.disable().
一個用空格標記分隔的標志可選列表,用來改變回調列表中的行為
以下是兩個樣品的方法命名fn1?and?fn2:
function fn1( value ){
console.log( value );
}
function fn2( value ){
fn1("fn2 says:" + value);
return false;
}
這些可以添加為回調函數作為一個$.Callbacks的列表,并調用如下:
var callbacks = $.Callbacks();
callbacks.add( fn1 );
callbacks.fire( "foo!" ); // outputs: foo!
callbacks.add( fn2 );
callbacks.fire( "bar!" ); // outputs: bar!, fn2 says: bar!
這樣做的結果是,它使構造復雜的回調列表變得簡單,輸入值可以通過盡可能多的函數根據需要輕松使用。
用于以上的兩個具體的方法:?.add()?和?.fire()?.add() 支持添加新的回調回調列表, 而.fire()?提供了一種用于處理在同一列表中的回調方法的途徑.
另一種方法由$.Callbacks?的remove(),用于從回調列表中刪除一個特定的回調。下面是.remove() 使用的一個例子:
var callbacks = $.Callbacks();
callbacks.add( fn1 );
callbacks.fire( "foo!" ); // outputs: foo!
callbacks.add( fn2 );
callbacks.fire( "bar!" ); // outputs: bar!, fn2 says: bar!
callbacks.remove(fn2);
callbacks.fire( "foobar" );
// only outputs foobar, as fn2 has been removed.
這個 flags 參數是$.Callbacks()的一個可選參數, 結構為一個用空格標記分隔的標志可選列表,用來改變回調列表中的行為 (比如. $.Callbacks( 'unique stopOnFalse' )).
?
可用的 flags:
默認情況下,回調列表將像事件的回調列表中可以多次觸發(fā)。
如何在理想情況下應該使用的flags的例子,見下文:
?
$.Callbacks( 'once' ):
var callbacks = $.Callbacks( "once" );
callbacks.add( fn1 );
callbacks.fire( "foo" );
callbacks.add( fn2 );
callbacks.fire( "bar" );
callbacks.remove( fn2 );
callbacks.fire( "foobar" );
/*
output:
foo
*/
?
$.Callbacks( 'memory' ):
var callbacks = $.Callbacks( "memory" );
callbacks.add( fn1 );
callbacks.fire( "foo" );
callbacks.add( fn2 );
callbacks.fire( "bar" );
callbacks.remove( fn2 );
callbacks.fire( "foobar" );
/*
output:
foo
fn2 says:foo
bar
fn2 says:bar
foobar
*/
?
$.Callbacks( 'unique' ):
var callbacks = $.Callbacks( "unique" );
callbacks.add( fn1 );
callbacks.fire( "foo" );
callbacks.add( fn1 ); // repeat addition
callbacks.add( fn2 );
callbacks.fire( "bar" );
callbacks.remove( fn2 );
callbacks.fire( "foobar" );
/*
output:
foo
bar
fn2 says:bar
foobar
*//code>
?
$.Callbacks( 'stopOnFalse' ):
function fn1( value ){
console.log( value );
return false;
}
function fn2( value ){
fn1("fn2 says:" + value);
return false;
}
var callbacks = $.Callbacks( "stopOnFalse");
callbacks.add( fn1 );
callbacks.fire( "foo" );
callbacks.add( fn2 );
callbacks.fire( "bar" );
callbacks.remove( fn2 );
callbacks.fire( "foobar" );
/*
output:
foo
bar
foobar
*/
因為$.Callbacks() 支持一個列表的flags而不僅僅是一個,設置幾個flags,有一個累積效應,類似“&&”。這意味著它可能結合創(chuàng)建回調名單,unique?和確保如果名單已經觸發(fā),將有更多的回調調用最新的觸發(fā)值?(i.e.$.Callbacks("unique memory")).
?
$.Callbacks( 'unique memory' ):
function fn1( value ){
console.log( value );
return false;
}
function fn2( value ){
fn1("fn2 says:" + value);
return false;
}
var callbacks = $.Callbacks( "unique memory" );
callbacks.add( fn1 );
callbacks.fire( "foo" );
callbacks.add( fn1 ); // repeat addition
callbacks.add( fn2 );
callbacks.fire( "bar" );
callbacks.add( fn2 );
callbacks.fire( "baz" );
callbacks.remove( fn2 );
callbacks.fire( "foobar" );
/*
output:
foo
fn2 says:foo
bar
fn2 says:bar
baz
fn2 says:baz
foobar
*/
Flag結合體是使用的$.Callbacks()內部的.done()?和?.fail()一個遞延容器-它們都使用?$.Callbacks('memory once').
$.Callbacks 方法也可以被分離, 為方便起見應該有一個需要定義簡寫版本:
var callbacks = $.Callbacks(),
add = callbacks.add,
remove = callbacks.remove,
fire = callbacks.fire;
add( fn1 );
fire( "hello world");
remove( fn1 );
pub / sub( Observer模式)背后的一般思路 是促進應用程序的松散耦合。而比對其他對象的方法調用的單個對象,一個對象,而不是另一個對象的一個特定的任務或活動,并通知當它發(fā)生。觀察家也被稱為訂閱者,我們指的出版商(或主體)觀察對象。出版商事件發(fā)生時通知用戶
作為一個組件$.Callbacks()創(chuàng)造能力,它可以實現一個pub / sub系統(tǒng)只使用回調列表。使用$.Callbacks作為主題隊列,發(fā)布和訂閱的主題系統(tǒng)可以實現如下:
var topics = {};
jQuery.Topic = function( id ) {
var callbacks,
method,
topic = id && topics[ id ];
if ( !topic ) {
callbacks = jQuery.Callbacks();
topic = {
publish: callbacks.fire,
subscribe: callbacks.add,
unsubscribe: callbacks.remove
};
if ( id ) {
topics[ id ] = topic;
}
}
return topic;
};
然后,可以很容易的使用這部分應用程序的發(fā)布和訂閱感興趣的事件:
// Subscribers
$.Topic( "mailArrived" ).subscribe( fn1 );
$.Topic( "mailArrived" ).subscribe( fn2 );
$.Topic( "mailSent" ).subscribe( fn1 );
// Publisher
$.Topic( "mailArrived" ).publish( "hello world!" );
$.Topic( "mailSent" ).publish( "woo! mail!" );
// Here, "hello world!" gets pushed to fn1 and fn2
// when the "mailArrived" notification is published
// with "woo! mail!" also being pushed to fn1 when
// the "mailSent" notification is published.
/*
output:
hello world!
fn2 says: hello world!
woo! mail!
*/
雖然這是有用的,可以采取進一步的實施。使用$.Deferreds,這是可能的,以確保發(fā)表者只為用戶發(fā)布一次特別的任務已經完成(解決)通知。這可能是如何在實踐中使用的一些進一步的評論,請參見下面的代碼示例:
// subscribe to the mailArrived notification
$.Topic( "mailArrived" ).subscribe( fn1 );
// create a new instance of Deferreds
var dfd = $.Deferred();
// define a new topic (without directly publishing)
var topic = $.Topic( "mailArrived" );
// when the deferred has been resolved, publish a
// notification to subscribers
dfd.done( topic.publish );
// Here the Deferred is being resolved with a message
// that will be passed back to subscribers. It's possible to
// easily integrate this into a more complex routine
// (eg. waiting on an ajax call to complete) so that
// messages are only published once the task has actually
// finished.
dfd.resolve( "its been published!" );
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯系方式:
更多建議: