Question

假设我有4个函数，每个函数都有setTimeout()内部的循环。如何使这些函数按顺序运行而不重叠？也就是说，如何让它们在前一个完成之后执行？

function1();
function2();
function3();
function4();

Answer 1

让每个函数在完成后调用下一个函数。

如果你想让它“动态”，实现一个函数队列，让每个函数在完成后调用队列中的下一个函数。然后，您可以通过填充队列并调用第一个函数来启动排序过程。

Answer 2

function function1(cb) {
    if (someCondition) {
        setTimeout(function1, 0);
    } else {
        // we are done
        cb();
    }
}
...

function1(function() {
    function2(function() {
        function3(function() {
            function4();
        });
    });
});

如果你走得太深，代码会开始变得混乱，所以使用像Step这样的某种流量控制。如果它不是节点，则步骤可能不起作用。

一个简单的队列可能是：

var queue = {
    items: [],
    add: function() {
        for (var i = 0; i < arguments.length; i++) {
            this.items.push(arguments[i]);
        }
    },
    run: function() {
        var this = that;
        this.items.shift()(function() {
            that.run();
        })
    }
};

queue.add(function1, function2, function3, function4);

这里每个函数都应该使用函数参数done作为它的第一个参数，并且应该在函数完成时调用它。

Answer 3

您可以传递一系列函数

和带参数的函数作为数组本身。

每个必须在为下一个功能设置定时器之前返回

function fifo(what, delay){
    if(what.shift){
        var a, f= what.shift() || '';
        if(typeof f== 'function') f();
        else if(f.constructor== Array){
            a= f.splice(1, f.length);
            f[0].apply(this, a);
        }
        if(what.length){
            setTimeout(function(){
                fifo(what, delay);
            },
            delay);
        }

    }
};

function announce(){
    return alert(location.href)
}
var A= [[alert, 1], [alert, 2], announce, [alert, 'That\'s All!']];
fifo(A, 100);

如何使用setTimeout（）按顺序工作？

3 个答案: