41

jQuery 1.7に追加された新しいものを調べていたところ、jQuery.Callbacks（）http://api.jquery.com/jQuery.Callbacks/が追加されていることがわかりました。

ドキュメントにはjQuery.callbacks（）の使用方法が示されていますが、使用したい場合の適切な例は示されていません。

コールバックリストからコールバックを追加/削除でき、jQuery.callbacks（）。fire（args）を実行できるようですが、これはそのリスト内のすべてのコールバックを起動するだけです。何かが足りないかもしれませんが、これはあまり役に立たないようです。

この新しい機能を最初に見たとき、頭の中で、キーと値のペアで使用できると思いました。これにより、アプリケーションの1か所でコールバック関数を管理する簡単な方法が提供されます。何かのようなもの

$.callbacks.add("foo", myFunction);

たとえば、関数の最後でそのコールバックを呼び出したい場合は、次のようなことを行うことができます。

$.callbacks().fire("foo", args);

ただし、特定のコールバックを起動できるようには見えません。指定された引数を使用してすべてのコールバックを起動するか、いずれも起動できません。

私が見た中で最も近いのは、.fire（）関数に「this」プロパティを設定するコンテキストを与える機能が与えられたことです。

.fireWith(context, args)

しかし、これもあまり役に立ちません。

  1. ドキュメントを誤解していますか？

  2. これが目的の機能である場合、これが役立ついくつかの適用可能な例は何ですか。

4

6 に答える 6

16

@Rocketsを拡張するには、少し答えて混乱を解消してください。

jQuery を使用する必要がある理由$.Callbacksは多面的です。

  1. ユーザーは 1 つの関数に多くのコードがあり、それを分割したいと考えています。

  2. 彼らはその情報を取得し、jQuery コールバック関数を介して送信します。これにより、コードをより扱いやすい部分に分割して作業することができます。
    したがって（たとえば）@Rocketのコードを見ると：

    var clickCallbacks = $.Callbacks();

clickCallbacks.add(function() { //one one function piece
    //parse and do something on the scope of `this`
    var c = parseInt(this.text(), 10);
    this.text(c + 1);
});
clickCallbacks.add(function(id) { //add a second non-related function piece
    //do something with the arguments that were passed
    $('span', '#last').text(id);
});

$('.click').click(function() {
    var $ele = $(this).next('div').find('[id^="clickCount"]');
    clickCallbacks.fireWith($ele, [this.id]); //do two separate but related things.
});
  3. 今できることは、関数の複数のコールバック バッチであり、コード全体に多くの変更を加える必要なく、必要と思われるときにいつでも呼び出すことができます。
于 2011-11-09T21:40:30.773 に答える
12

同じメソッドを使用してさまざまなDOM要素を更新する場合に、コールバックが役立つことがわかります。

これが安っぽい例です：http：//jsfiddle.net/UX5Ln/

var clickCallbacks = $.Callbacks();

clickCallbacks.add(function() {
    var c = parseInt(this.text(), 10);
    this.text(c + 1);
});
clickCallbacks.add(function(id) {
    $('span', '#last').text(id);
});

$('.click').click(function() {
    var $ele = $(this).next('div').find('[id^="clickCount"]');
    clickCallbacks.fireWith($ele, [this.id]);
});

クリックカウンターと、何かをクリックすると「最後にクリックされた」が更新されます。

于 2011-11-09T21:22:23.620 に答える
3

これは$.Callbacks、実装の詳細として始まったようです。つまり、関数のリストを管理し、同じ引数を使用して特定のリスト内のすべての関数を呼び出す手段です。リストの動作をカスタマイズするために渡すことができるフラグなどの追加機能を備えた、 C＃のマルチキャストデリゲートに少し似ています。

良い例は、jQueryがそのイベント$.Callbacksを実装するために内部的に使用することです。コールバックリストを初期化します。readybindReady()

readyList = jQuery.Callbacks( "once memory" );

onceとフラグに注意してくださいmemory。これにより、コールバックリストが1回だけ呼び出され、リストが呼び出された後に追加された関数がすぐに呼び出されます。

次に、ready()指定したハンドラーをそのリストに追加します。

ready: function( fn ) {
    // Attach the listeners
    jQuery.bindReady();

    // Add the callback
    readyList.add( fn );

    return this;
}

最後に、DOMの準備ができると、コールバックリストが起動されます。

readyList.fireWith( document, [ jQuery ] );

すべてのreadyハンドラーは、グローバルjQueryオブジェクトへの同じ参照を使用して同じドキュメントのコンテキストで呼び出されます。これらは一度だけ呼び出すことができ、渡された追加のハンドラーはready()それ以降すぐに呼び出されます。このすべての礼儀です$.Callbacks。

于 2011-11-09T21:36:59.550 に答える
2

コンテキストの設定について具体的な言及はありませんが、任意の数の引数を渡すことができるので、それは潜在的に役立つでしょう。また、フラグを最初の引数として渡す独自の規則を作成し、残りの引数リストを処理することを意図していない場合は、リスナーがすぐにfalseを返すようにすることもできます。

このようなものが便利だったかもしれないが、代わりにカスタムイベントでbind（）とtrigger（）を使用した場合に遭遇しました。新しいメッセージについてサービスをポーリングしているメッセージ処理システム（Webベースのチャットルームまたは電子メールクライアント）を想像してみてください。1つの機能は、スパンに数値を設定したり、何かが起こったときにうなり声を表示したりすることです。もう1つは、グリッドの更新です。トリガーを使用すると、リスナーごとにイベントをトリガーし、eventDataから渡された引数を「展開」する必要があります。コールバックを使用すると、1回の起動で、リスナーは単純な引数リストを持つ単純なjavascript関数になります。

コールバックは必ずしも革新的ではありませんが、コードが少なくてクリーンになります。

于 2011-11-09T20:47:39.937 に答える
0

多くのビジネス ロジックと少なくとも 11 の外部サービスを備えたアプリに取り組んでいます。Deferred 実装で自分の意思を強制するのではなく、コールバックなどを使用して独自のフロー制御クラスと動作を記述できると、物事をまっすぐに保つことができます。

于 2011-11-09T21:12:53.767 に答える