2011-02-10 118 views
5

我有大量的函数需要连续运行,但不是在另一个完成之前。我需要的是一种排队这些函数的方法,只有在前一个函数成功完成后才能运行。有任何想法吗?JavaScript函数队列

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

你的代码应该只是罚款...(如果“成功地完成了”你的意思是,函数返回) – 2011-02-10 02:30:15

+1

有异步的东西在你的功能呢?如果没有,我看不到问题。 – spender 2011-02-10 02:31:18

+0

我的大部分函数都包含AJAX调用。每一个都取决于上次调用的成功。 – user610728 2011-02-10 02:32:33

回答

0

为什么不按照您所示的方式完成,只要将它们列入覆盖函数?

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

如果您的函数包含AJAX调用,那么您需要在处理AJAX调用的回调函数的末尾挂接它们。

0

,以确保他们连续运行,则可能会返回从每一个和使用,在随后的一个返回值的值...

function do_1_to_5() { 

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

} 
7

你可以使用这样的事情:

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])(); 
5

您可以创建一个队列功能:

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/

0

你并不需要所有的机器,只要把你的函数在数组中。然后你可以循环它们。

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)](); 
} 
0

退房async.js - 它提供了一种机制链接起来的功能,使他们异步或一个后执行另一种方法是用一种很好的方法来捕捉所有执行功能的结果和/或错误。

https://github.com/caolan/async