Вызов нескольких функций последовательно с помощью jquery

Question

Я хочу перебрать объект, содержащий функции, которые будут выполняться одна за другой. Моим самым идеальным подходом было бы как-то иметь эту цепочку (т.е. func2 ожидает func1 и func3 ждет func2), но это должно происходить динамически, и все функции будут иметь разную продолжительность.

Я использую jQuery, поэтому я подумал, что, возможно, «queue ()» может помочь, но я с этим мало работал.

A main concern - не добавлять никакие области действия / обратные вызовы к функциям в объекте. Я бы предпочел как-то заключить их в родительскую функцию для выполнения внутри цикла, чтобы создать обратный вызов / цепочку.

Вот пример того, что у меня сейчас есть, но тупой. Спасибо за любую помощь!

var obj = [
{'name':'func1','callback':function(){ alert(1); }},
{'name':'func2','callback':function(){ alert(2); }},
{'name':'func3','callback':function(){ alert(3); }}
];

$.each(obj, function(x, el) { 
    el.callback();
});

Answer 1

Попробуйте это:

var obj = [
     function() { alert(1); },
     function() { alert(2); },
     function() { alert(3); }
];
$.each(obj,function() {
    // Replace 500 with whatever you want
    setTimeout(this,500);
});

Вы также можете использовать цикл for, поскольку нет смысла использовать $.each, хотя это не проблема:

for (var i = 0; i < obj.length; i++) {
    // Replace 500 with whatever you want
    setTimeout(this[i],500);
}

Это также зависит от того, хотите ли вы иметь другое время в зависимости от того, какую функцию вы выполняете.

Вот для for цикла:

for (var i = 0; i < obj.length; i++) {
    // Replace 500 with whatever you want
    setTimeout(this[i],500 * i);
}

А с $.each:

$.each(obj,function(i) {
    // Replace 500 with whatever you want
    setTimeout(this,500 * i);
});

Answer 2

Библиотека async-waterfall также может помочь вам в этом.