Javascript中的函数链

Question

在javascript中,我们以准并行方式触发函数

window.onload=function(){
document.getElementById("test").addEventListener('click', function1(), false);
//consider it takes 3 seconds to be completed
document.getElementById("test").addEventListener('click', function2(), false);
}

我们如何能火function2()当function1()执行完毕？

在jQuery中,我们可以链接一系列函数(例如):

$(this).fadeIn(3000).fadeOut(2000);

如何在纯JavaScript中进行此功能更改？

编辑:在回应否定评论和投票时,我提供了这个例子:

function delay(time, func){
setTimeout(func,time);
}

delay(2000,function(){alert('Function 1');});
delay(1000,function(){alert('Function 2');});

在此示例中,您将首先看到"功能2"的警报.

Answer 1

如果function1是异步的,你将不得不修改它,以便调用者可以传递一个完成后将执行的回调,例如jQuery的ajax方法提供回调,例如成功,错误,......:

window.onload = function() {
    function1(function() {
        // the callback is executed once function1 completes so
        // we can now invoke function 2
        function2();
    });
};

顺便说一句,这可以用更简洁的方式写成:

window.onload = function() {
    function1(function2);
};