Question

我需要一些关于javascript中“控制流”的最佳实践的帮助。在下面的示例中，我的updateUI函数未正常工作，因为我的saveData函数尚未完成。

function save(data){
   saveData(data);
   updateUI();
}

对于临时修复，我做了这个

function save(data){
if(saveData(data)){
   updateUI();
   }
}

更新：这是我的saveData方法

function saveData(data){

$.ajax({
    url: url, // a variable, not important for this example
    data: data,
    type: "post",
    dataType: "json",
    success: function(data) { return true; },
    error: function(e) {
        console.log(e);
    }
})

我觉得我应该学习“标准”方式，如果存在的话。

Answer 1

假设saveData正在调用AJAX函数（例如$.ajax），请让它返回该AJAX函数的结果：

function saveData() {
    return $.ajax({
        url: url, // a variable, not important for this example
        data: data,
        type: "post",
        dataType: "json"
    }).fail(function(e) {
        console.log(e);
    });
}

然后使用jQuery延迟链接来更新UI：

saveData().done(updateUI).fail(showError);

它允许您避免必须将回调函数传递到saveData调用，然后允许您将数据保存逻辑与UI逻辑完全分离。

编辑我已经更新了代码，以显示如何使用延迟对象包含默认的fail处理程序，但仍返回promise以便您可以处理你的UI在外面更新。

Answer 2

这是因为你的saveData是一个同步方法。您需要在oncomplete事件中调用updateUI（）。

查看this article并阅读promise()

Answer 3

有几种方法可以做到这一点。

你可以为saveData方法提供一个回调函数 - 当saveData完成时你会调用它。

var saveData = function(data, cb){
    // do something with data to save it
    cb.apply(this, ['arguments', 'as', 'an','array']); // or use .call instead
}

您可以实现一些事件，以便您的updateUI方法侦听一个事件，当它发生时会导致updateUI运行，当您完成saveData时会触发该事件。 jQuery提供了一个，以及Backbone。

有很多方法可以做到这一点 - 选择最适合你的方式。

Javascript - 控制流程

3 个答案: