Question

我正在编写一个简单的实用程序来处理我必须在我的应用程序中进行的大量JSON调用，但是下面的readJson函数的问题是它在获取Ajax的内部函数获得数据之前完成，所以它返回undefined。任何人都可以指出我对这个问题的现有答案，或者就如何更好地构造这个函数提出任何建议，以便在Ajax请求完成之前它不会返回？

json_manager = { 
    thisJson:'',
    readJson:function(theFileName, thePathName) {

        var theUrl=(thePathName+theFileName);
        $.getJSON(theUrl).done(function(theJSON) { 
                json_manager.thisJson=theJSON;
        });
        return(json_manager.thisJson)
    },
        //more functions 
    }

Answer 1

在函数返回之前，序列化事物以便ajax调用完成的唯一方法是使ajax调用同步。并且，不建议这样做，因为它通常会为最终用户造成严重不良的用户体验，在这种情况下，浏览器被锁定并且在ajax调用期间不处理事件。不要这样做。

除此之外，AJAX中的“A”代表异步，您需要学习使用回调以异步方式编程，以执行需要AAX调用结果的工作。因为Ajax通常是异步的，所以你的readJson()函数将在ajax调用完成之前返回。因此，您无法在该函数中返回ajax调用的结果。

要重构您的代码以使用异步ajax，您必须将需要$.getJSON()结果的所有工作移动到回调中，并使用结果作为成功/完成处理程序中的参数调用该回调函数ajax电话。

你可以这样做：

json_manager = { 
    thisJson:'',
    readJson:function(theFileName, thePathName, successHandlerFn) {

        var theUrl=(thePathName+theFileName);
        $.getJSON(theUrl).done(function(theJSON) { 
                successHandlerFn(theJSON);
        });
    },
        //more functions 
}

Answer 2

您遇到了经典的异步问题。发生的事情是$.getJSON调用只不过是设置对服务器的调用。在当前正在执行的函数将控制权返回给浏览器之前，它实际上不会执行调用。

在这种情况下，您必须将代码结构化为告诉数据的位置，而不是询问数据。

这样的事情：

json_manager = { 

    readJson:function(theFileName, thePathName, callback) {

        var theUrl=(thePathName+theFileName);
        $.getJSON(theUrl).done(callback);

    },
        //more functions 
}

然后你可以这样称呼它：

json_manager.readJson('file', 'path', function(data) {
   // do something with the returned json
});

这样，您就可以为readJson函数提供有关如何处理从服务器获取的数据的说明。

延迟函数返回直到Ajax请求完成

2 个答案: