JavaScript函数队列

我有大量的function需要连续运行，但在其他function完成之前不会运行。 我需要的是一种将这些函数排队的方法，只有在上一个函数成功完成后才能运行。 有任何想法吗？

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：

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

所以如果这些是你的function……

 function f1() { alert(1); } function f2() { alert(2); } function f3() { alert(3); } 

…你只需在新的Queue实例中传递它们（它们的引用）：

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

然后执行callNext()以按顺序调用函数：

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

---

现场演示： http ： //jsfiddle.net/CEdPS/3/

Answer 3

你为什么不按照你所展示的那样做，将它们列在封面function中？

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

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

Answer 4

为了确保它们连续运行，您可以从每个值返回一个值，并在后续的值中使用该返回值…

 function do_1_to_5() { r1 = Function1(); r2 = Function2(r1); r3 = Function3(r2); r4 = Function4(r3); r5 = Function5(r4); } 

Answer 5

你不需要所有的机器，只需将你的function放在一个数组中。 然后你可以循环它们。

 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 6

查看async.js – 它提供了一种链接函数的机制，使它们可以异步或一个接一个地执行，并且可以很好地捕获所有已执行函数的结果和/或错误。

https://github.com/caolan/async