In my JavaScript App (jQuery) I have two events that are fired asynchronously:
How do I "sync" these two async events in order to "call a method" only after these two events fired.
I would need an approach that works for multiple events also.
Use deferred objects.
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();
ajax calls implement the Promise interface, presuming the asynchronous events in question are ajax this should be exactly what your after...You may want to look at async.js which provides a very interesting and clean way of syncing the execution of asynchronous actions.
For example, the waterfall method allows you to chain asynchronous actions in a sequential order.
Such an execution looks pretty and simple in your real-life code :
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'
});
async.parrallel if you want your actions to run in parrallel.