Очередь функций JavaScript

Question

У меня есть тонна функций, которые должны быть запущены последовательно, но не раньше, чем завершится другаяМне нужен способ поставить эти функции в очередь только после успешного завершения предыдущей функции.Есть идеи?

Function1();
Function2();
Function3();
Function4();
Function5();

Answer 1

Вы можете использовать что-то вроде этого:

var FunctionQueue = (function(){
    var queue = [];
    var add = function(fnc){
        queue.push(fnc);
    };
    var goNext = function(){
        var fnc = queue.shift();
        fnc();
    };
    return {
        add:add,
        goNext:goNext
    };
}());

и используйте его так:

var fnc1 = function(){
    window.setTimeout(function(){
        alert("1 done");
        FunctionQueue.goNext();
    }, 1000);
};

var fnc2 = function(){
    window.setTimeout(function(){
        alert("2 done");
        FunctionQueue.goNext();
    }, 5000);
};

var fnc3 = function(){
    window.setTimeout(function(){
        alert("3 done");
        FunctionQueue.goNext();
    }, 2000);
};

FunctionQueue.add(fnc1);
FunctionQueue.add(fnc2);
FunctionQueue.add(fnc3);
FunctionQueue.goNext();

Редактировать через несколько лет: Другой способ, которым люди подходят к этому, - передать функцию next, которую вы можете вызвать, чтобы продолжить цепочку. Вот так:

var Queue = function(arr){
    var index = 0;
    var next = function(){
        if (index >= arr.length) {return;}
        arr[index++](next);
    };
    return next;
};

var fn1 = function(next){
    console.log("I am FN1");
    next();
};

var fn2 = function(next){
    console.log("I am FN2");
    setTimeout(next,1000);
};

var fn3 = function(next){
    console.log("I am FN3");
    setTimeout(next,3000);
};

var fn4 = function(next){
    console.log("I am FN4");
    setTimeout(next,1000);
};

Queue([fn1, fn2, fn3, fn4])();

Answer 2

Вы можете создать функцию очереди:

function Queue(arr) {
    var i = 0;
    this.callNext = function() { 
        typeof arr[i] == 'function' && arr[i++]();
    };
}

Так что, если бы это были ваши функции ...

function f1() {
    alert(1);   
}

function f2() {
    alert(2);   
}

function f3() {
    alert(3);   
}

... вы просто передаете их (их ссылки) внутриновый экземпляр очереди:

var queue = new Queue([f1, f2, f3]);

Затем вы выполняете callNext() для последовательного вызова функций:

queue.callNext();
queue.callNext();
queue.callNext();

---

Демонстрация в реальном времени: http://jsfiddle.net/CEdPS/3/

Answer 3

Проверьте async.js - он предоставляет механизм для объединения функций в очередь, чтобы они выполнялись асинхронно или одна за другой, с отличным способом отловить результаты и / или ошибки от всех выполненных функций.

https://github.com/caolan/async

Answer 4

Вам не нужен весь этот механизм, просто поместите ваши функции в массив.Затем вы можете зациклить их.

var runThese = [
    Function1,
    Function2, 
    Function3,
    Function4,
    Function5
];

JavaScript является однопоточным, поэтому вы гарантированно завершите его до следующего запуска.

for (var i = 0; i < runThese.length; i++) {
    runThese[i]();
}

Или, поскольку ваши функции имеют детерминированные имена,Вы можете вообще избежать массива:

for (var i = 1; i <= 5; i++) {
    window["Function" + String(i)]();
}

Answer 5

Чтобы убедиться, что они работают последовательно, вы можете вернуть значение из каждого и использовать это возвращенное значение в последующем ...

function do_1_to_5() {

    r1 = Function1(); 
    r2 = Function2(r1); 
    r3 = Function3(r2); 
    r4 = Function4(r3); 
    r5 = Function5(r4);

}

Answer 6

Почему бы вам не сделать именно то, что вы показали, перечислив их в функции покрытия?

function do_1_to_5() {
    Function1(); 
    Function2(); 
    Function3(); 
    Function4(); 
    Function5();
}

Если ваша функция содержит вызовы AJAX, вам нужно подключить их в конце функций обратного вызова, которые обрабатывают вызовы AJAX.