javascript - JavaScript で 2 つの非同期イベントを同期する

Question

私の Javascript アプリ (jQuery) には、非同期で発生する 2 つのイベントがあります。

• ウィジェット 1 は、読み込みが完了すると「Event1」を起動します
• ウィジェット 2 は、読み込みが完了すると「Event2」を起動します

これら 2 つのイベントが発生した後にのみ「メソッドを呼び出す」ために、これら 2 つの非同期イベントを「同期」するにはどうすればよいですか。

複数のイベントでも機能するアプローチが必要です。

Answer 1

遅延オブジェクトを使用します。

var deferredObj1 = $.Deferred(),
    deferredObj2 = $.Deferred();

$.when(deferredObj1,deferredObj2).done(function(){
    console.log("They are both done!");
});

// inside the Event1 handler:
deferredObj1.resolve();

// inside the Event2 handler:
deferredObj2.resolve();

Answer 2

async.js非同期アクションの実行を同期するための非常に興味深くクリーンな方法を提供するものを確認することをお勧めします。

たとえば、このwaterfallメソッドを使用すると、非同期アクションを順番に連鎖させることができます。

このような実行は、実際のコードではきれいでシンプルに見えます:

async.waterfall([
    function(callback){
        callback(null, 'one', 'two');
    },
    function(arg1, arg2, callback){
        callback(null, 'three');
    },
    function(arg1, callback){
        // arg1 now equals 'three'
        callback(null, 'done');
    }
], function (err, result) {
   // result now equals 'done'    
});