如何使for循环等待，直到回调响应值

I have click event which calls FireCallBackEvents and from there I pass the array of function which all are callback. Now I want to call function b() after function a() which gives the result of callback I call through setTimeout(). I expect that it will delay in giving result.

我有点击事件调用FireCallBackEvents并从那里传递所有回调的函数数组。现在我想在函数a()之后调用函数b(),它给出了我通过setTimeout()调用的回调结果。我希望它能延迟给出结果。

Now in below code alert of first function callback is called after function b and c is called.

现在在下面的代码中,在调用函数b和c之后调用第一个函数回调。

This is only a sample of my real code.

这只是我真实代码的一个示例。

function FireCallBackEvents(){
    generalizeCallBack([a,b,c]);
}

function a(parameter1, parameter2,callback){
    alert("Hello World: " + parameter1 + " : " + parameter2);
    setTimeout(function(){callback("12")},600);
}
function b(parameter1, parameter2,callback){
    alert("Hello World1: " + parameter1 + " : " + parameter2);
    callback("123");
}
function c(parameter1, parameter2, callback){
    alert("Hello World2: " + parameter1 + " : " + parameter2);
    callback("1234");
}

function generalizeCallBack(arrayOfFunctions){
    for(var i = 0; i < arrayOfFunctions.length; i++){
        arrayOfFunctions[i]("1","2",function(we){
            alert(we);
        });
    }
}

2 个解决方案

#1

You could use this variant of your last function, which calls it recursively from the callback function you pass:

您可以使用上一个函数的这个变体,它从您传递的回调函数中递归调用它:

function generalizeCallBack(arrayOfFunctions){
    if (!arrayOfFunctions.length) return; // nothing to do
    var func = arrayOfFunctions.shift(); // extract function to execute
    func("1","2", function(we){
        alert(we);
        generalizeCallBack(arrayOfFunctions); // recurse with shorter array
    });
}

Note that this changes the array you pass. If you prefer that the callers keep their array in tact, use slice and not shift:

请注意,这会更改您传递的数组。如果你更喜欢调用者保持他们的阵列,请使用切片而不是移位:

function generalizeCallBack(arrayOfFunctions){
    if (!arrayOfFunctions.length) return; // nothing to do
    var func = arrayOfFunctions[0]; // get function to execute
    func("1","2", function(we){
        alert(we);
        generalizeCallBack(arrayOfFunctions.slice(1)); // recurse with shorter array
    });
}

Since this version takes an array copy at every (recursive) call, we could make it more efficient by only doing that the first time (as suggested by @Alnitak):

由于此版本在每次(递归)调用时都会获取一个数组副本,因此我们可以通过仅在第一次执行此操作(如@Alnitak所建议的那样)来提高效率:

function generalizeCallBack(arrayOfFunctions){
    function recurse (arrayOfFunctions) {
        if (!arrayOfFunctions.length) return; // nothing to do
        var func = arrayOfFunctions.shift(); // extract first function
        func("1","2", function(we){
            alert(we);
            recurse(arrayOfFunctions); // recurse with shorter array
        });
    }
    // take copy (slice) of array in order not to alter the caller's array:
    recurse(arrayOfFunctions.slice(0));
}

This way only one copy is taken of the array. The recursive part works on that same copy, making it shorter as it goes down the recursion chain.

这样,只能从阵列中获取一个副本。递归部分在同一个副本上工作,随着它在递归链中向下变短。

This is the same, but written as an immediately invoked function expression:

这是相同的,但写成一个立即调用的函数表达式:

function generalizeCallBack(arrayOfFunctions){
    (function recurse (arrayOfFunctions) {
        if (!arrayOfFunctions.length) return; // nothing to do
        var func = arrayOfFunctions.shift(); // extract first function
        func("1","2", function(we){
            alert(we);
            recurse(arrayOfFunctions); // recurse with shorter array
        });
        // take copy (slice) of array in order not to alter the caller's array:
    }(arrayOfFunctions.slice(0)));
}

#2

You should not call your array of functions within a loop in your generalizeCallBack function. It wouldn't help you delaying later functions (function b and c) from being executed based on the result of an early function (function a) which calls setTimeout.

您不应该在generalizeCallBack函数中的循环内调用函数数组。根据调用setTimeout的早期函数(函数a)的结果,延迟执行后面的函数(函数b和c)无助于它。

The setTimeout function will only be executed when the browser gets next breathing space. That is right after your function loop.

只有当浏览器获得下一个呼吸空间时才会执行setTimeout函数。这是在你的函数循环之后。

The solution is to let your function a return a promise and execute other functions (b and c) when the promise is successful.

解决方案是让你的函数返回一个promise并在promise成功时执行其他函数(b和c)。

#1