Продолжаю графоманить. На этот раз предлагаю свой способ поочередного вызова асинхронных функций (таймаутов, анимаций, аяксов и пр.) и избегания ужаса вложенных колбеков.
Для этого вызываем функцию waiting, затем по цепочке вызываем метод wait. Аргументом waiting и wait служит колбек, определенный в примере, как runNext. Его вызов запускает очередную порцию кода.
Для проверки работы откройте консоль.
(function(){
window.wait = function(first){
return new (function(){
var self = this;
var callback = function(){
var args;
if(self.deferred.length) {
args = [].slice.call(arguments);
args.unshift(callback);
self.deferred[0].apply(self, args);
self.deferred.shift();
}
}
this.wait = function(run){
this.deferred.push(run);
return self;
}
this.deferred = [];
first(callback);
})
}
/* Пример */
wait(function(runNext){
console.log('Run 1');
setTimeout(function(){
runNext(1,2); //передаем какие-нибудь аргументы в следующий вызов
}, 1000);
}).wait(function(runNext, a, b){
console.log('Run 2, a='+a+' b='+b ); //используем аргументы из предыдущего вызова
setTimeout(runNext, 1000);
}).wait(function(runNext){
console.log('Run 3');
setTimeout(function(){
console.log('End 3')
runNext();
}, 1000);
}).wait(function(runNext){
console.log('Run 4');
setTimeout(runNext, 1000);
}).wait(function(){
console.log('Last one');
});
})();
Пример с анимациями
http://jsfiddle.net/finom/XSGub/37/