javascript - 用于处理函数体中所有内容的回调模式

Question

当我的函数包含在其主体内发出新线程/工作程序的内容时，使用的正确模式是什么？为了更好地说明问题，请查看以下 jsFiddle:http://jsfiddle.net/Dx29q/

function write(text){
    var obj = document.getElementById('foo');
    obj.innerHTML = obj.innerHTML + text + ' ';
}

function test(a,b,callback){

    write(a+b); //A
    setTimeout(function(){write(a-b);},1000); //B    
    write(a*b); //C

    callback(); //D
}

test(3,2,function(){

    write("Finished!");
});

问题在于执行操作的实际顺序是 ACDB。我只想在回调完成之前函数中的所有内容之后才执行回调。我必须使用纯 JavaScript(甚至不是库)。我正在努力寻找解决使用回调时高级情况的任何好的教程，只有完整的基础知识。

感谢您的任何建议!

编辑如下:

• 我需要实现的顺序是 (ABC)D，我不关心 ABC 之间的顺序，只要 D 仅在它们完全完成后才执行即可。

• setTimeout 只是一个例子，为了更好地想象调用 foo()、bar()、baz() 和 callback() 的函数的情况。 foo、bar、baz需要分别同时执行，callback()需要在之后调用。

Answer 1

您应该执行额外的检查，即如下所示:

function write(text){
    var obj = document.getElementById('foo');
    obj.innerHTML = obj.innerHTML + text + ' ';
}

function test(a,b,callback){
    var finished = false,
        interval;

    write(a+b);
    setTimeout(function(){write(a-b); finished = true;},1000);    
    write(a*b);

    interval = setInterval(function(){
        if (finished) {
            callback();
            clearInterval(interval)}
    }, 100);
}

test(3,2,function(){

    write("Finished!");
});

http://jsfiddle.net/U9K5g/1/

此外，阅读有关 Promises/A+ 的内容可能对您有用

很好的例子是 - http://www.html5rocks.com/en/tutorials/es6/promises/