等待函数完成执行

Question

我有以下：

function functionA() {
    var myVar = functionB();
    functionC(myVar);
}

函数B需要回答的时间，取决于用户输入。可能是1s，也可能是10s。所以 functionC 总是被一个未定义的值调用，因为 functionB() 还没有完成。所以我尝试了这个：

function functionA() {
    var def = $.Deferred();
    var myVar = functionB();
    def.resolve();
    $.when(def).done(function () {
        functionC(myVar);
    });
}

这也不起作用。我在 StackOverflow 上看到了这个：javascript function wait until another function to finish 但它怎么能转移到我的问题上呢？ 回顾一下，functionA 的执行需要停止，直到 functionB() 得到响应。谢谢。

Answer 1

将您的示例放在一个简单的对象中，您可以执行以下操作：

var myObject = {
    myProp: null,
    functionA: function () {
        this.functionB();
        var self = this;
        var i = setInterval(function () {
            if (self.myProp) {
                clearInterval(i);
                self.functionC();
            }
        }, 100);
    },
    functionB: function () {
        // ...
        this.myProp = 'user input';
    },
    functionC: function () {
        // ...
    }
};
myObject.functionA();

如果设置了myProp，脚本将每0.1s检查一次。如果是，则清除间隔并调用functionC。

在这种情况下不需要 jQuery。

Answer 2

您可以将 functionC 作为参数传递给您的 functionB，如提及 here。

function functionA() {
   var myVar = functionB(callback);
   functionC(myVar);
}

function functionB(callback) {
   // does something ...
   if(callback && typeof(callback) === "function") {
      callback();
   }
}

Answer 3

您可以更改 functionB 以返回延迟对象，然后您可以在异步处理程序中解析该对象，如下所示：

function functionA() {
    var deferred = functionB();
    $.when(deferred).done(functionC);
}

function functionB() {
    var deferred = $.Deferred();

    // do something async here...
    // asyncCallback() { 
    //     deferred.resolveWith(this, dataRetrieved);   
    // }

    return deferred;
}

function functionC(data) {
    console.log(data);
}