在另一个方法完成执行后强制执行代码

Question

这是我想做的：

setSource 是一个执行大约 3 秒的函数。

 editor.setSource();

 setTimeout(function () {
      //do something, some commands
 }, 3000);

我想要 //do something, some commands 部分要在 setSource() 的最后一行执行后执行。现在我用 setTimeout 来做，但我认为这不是很好的解决方案，因为有时 setSource() 可能需要 5 秒才能执行。如何做到这一点？

Answer 1

我也在寻找解决方案，我只想在前一个函数完全执行后才执行我的第二个函数，我尝试了回调函数但仍然没有得到解决方案，最后我找到了使用简单的解决这个问题的最简单的方法$.ajax({ }); 适合我的方法代码:)。

例如，

$.ajax({
  url: function1(),
  success: function(){
    //function 2 code here or just call function2() here
  }
}); 

就是这样，在这段代码中，url参数将调用第一个函数，只有在其执行成功时才会调用第2个函数。

Answer 2

此答案使用promises，这是ECMAScript 6 标准的JavaScript 功能。如果您的目标平台不支持promises，请使用PromiseJs 填充它。

在较新的浏览器版本中，您可以使用ES6 promises。 editor.setSource() 将其执行包装到 Promise 中并返回，因此可以继续执行其他函数。

editor.setSource = function(){
    return new Promise(function(fulfill, reject){
        //do your work
        fulfill(resultValue);
    });
};

要继续使用另一个函数，只需在 promise 上使用 then 方法。

var promise = editor.setSource();
promise.then(function(result){
    //do something more
});

Answer 3

让setSource 接受回调参数：

editor.setSource = function(callback) {
    // do editor things
    callback();
}

然后将要执行的下一个代码块作为回调传递：

editor.setSource(function() {
    // do some other things
});

---

如果你可以访问 jQuery 的延迟对象，你可以在这里使用它们：

1. 创建一个新的延迟对象。
2. 开始超时以执行您的长时间任务。
3. 返回延迟对象。
4. 在超时时间内，一旦任务完成，调用deferred.resolve。

 

editor = {
    setSource: function() {
        var deferred = $.Deferred();

        console.log("Beginning editor.setSource...");

        setTimeout(function() {
            // This function took a while to occur
            deferred.resolve();
        }, 3000);

        return deferred;
    }
}

$.when(editor.setSource()).then(function() {
    console.log("Editor is done!");
});

如果您正在执行 AJAX 或动画或其他已使用延迟对象的 jQuery 任务，您可以只返回其结果值，而不是制作您自己的延迟对象：

editor = {
    setSource: function() {
        return $.get({
            url: "myurl.com/mypage",
            data: $("#myform").serialize()
        });
    }
}

$.when(editor.setSource()).then(function() {
    console.log("Editor is done!");
});

请务必查看如何解决或拒绝延迟对象，以及如何处理这些对象。