jQuery.Callbacks ()

설명 : 콜백 목록을 관리하는 강력한 방법을 제공하는 다목적 콜백 목록 객체입니다.

$.Callbacks()을 포함한 다수의 방법을 지원하는 callbacks.add(), callbacks.remove(), callbacks.fire()및 callbacks.disable().

시작하기

다음은 두 개의 샘플 방법은 이름이 지정됩니다 fn1및 fn2:

function fn1( value ) {
  console.log( value );
}
 
function fn2( value ) {
  console.log( "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!" );
이 결과로 입력 값을 필요한만큼 많은 함수로 쉽게 전달할 수있는 복잡한 콜백 목록을 구성하는 것이 간단 해졌습니다.

두 구체적인 방법은 위에서 사용되었다 : .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" );

지원되는 플래그

flags인수에 선택적 인수이다 $.Callbacks()콜백에서의 동작을 변경할 공간 분리 문자열의리스트로 구성 (예. $.Callbacks( "unique stopOnFalse" )).

가능한 플래그 :
once: 콜백 목록을 한 번만 실행할 수 있도록합니다 (예 : 지연됨).
memory: 이전 값을 추적하고 최근에 "기억 된"값 (Deferred와 같은)으로 목록이 바로 실행 된 후에 추가 된 모든 콜백을 호출합니다.
unique: 콜백을 한 번만 추가 할 수 있도록합니다 (따라서 목록에 중복 된 내용이 없습니다).
stopOnFalse: 콜백이 false를 반환 할 때 호출을 인터럽트합니다.
기본적으로 콜백 목록은 이벤트 콜백 목록처럼 작동하며 여러 번 "실행"될 수 있습니다.

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
*/
$.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()여러 플래그를 설정하지 않고 하나 이상의 플래그 목록을 지원 유사한 누적 효과 "&&"가 있습니다. 즉, 플래그를 결합하여 예를 들어 둘 다 고유 하고 콜백 목록이 이미 실행 된 경우 콜백을 추가하여 최신 실행 된 값 (예 :)으로 호출하도록 할 수 있습니다$.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
*/
와의 플래그 조합 $.Callbacks()은 내부적으로 jQuery .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

pub / sub (Publish / Subscribe, 또는 Observer 패턴)의 일반적인 개념은 응용 프로그램에서 느슨한 결합을 촉진하는 것입니다. 단일 오브젝트가 다른 오브젝트의 메소드를 호출하는 대신, 오브젝트는 다른 오브젝트의 특정 타스크 또는 활동을 대신 등록하고 _ 생할 때이를 통지합니다. 옵서버는 구독자라고도하며, 관찰 대상의 개체를 게시자 (또는 주체)로 지칭합니다. 게시자는 이벤트 발생시 구독자에게 알립니다.

구성 요소 생성 기능을 보여주기 위해 $.Callbacks()콜백 목록 만 사용하여 Pub / Sub 시스템을 구현할 수 있습니다. 사용 $.Callbacks주제 큐, 출판을위한 시스템으로 다음과 같이 구현 될 수 주제에 가입 :

1
2
삼
4
5
6
7
8
9
10
11
12
13
14
15 명
16
17
18
19
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;
};

그러면 응용 프로그램의 일부에서이 이벤트를 사용하여 관심있는 이벤트를 쉽게 게시하고 구독 할 수 있습니다.

// 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게시자가 특정 작업이 완료 (해결) 된 경우에만 구독자에게 알림을 게시 할 수 있습니다. 이 코드를 실제로 어떻게 사용할 수 있는지에 대한 추가 설명은 아래 코드 샘플을 참조하십시오.

// 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( "it's been published!" );