Question

当脚本依赖于某些ajax或服务器响应时，我通常会在javascript中构建我的脚本或类似的东西。我真的觉得这不是最有效的做事方式，那么做这些类型的脚本会有什么更好的方法呢？

function someclass() {

    //some internal variables here
    this.var1 = null;
    this.var2 = null;
    ...

    //some ajax function which gets some critical information for the other functions
    this.getAJAX = function() {
        self = this;
        urls = "someurlhere";
        //jquery ajax function
        $.ajax({
            type: "GET",
            url: url,
            dataType: 'json',
            complete: function (xhr, textStatus) {
                //get the response from the server
                data = JSON.parse(xhr.responseText);
                //call the function which will process the information
                self.processAJAX(data);
            }
         })

    this.processAJAX = function(data) {
        //set some of the internal variables here
        //according to the response from the server

        //now that the internal variables are set,
        //I can call some other functions which will
        //use the data somehow
        this.doSomething();
    }

    this.doSomething = function() {
        //do something here
    }

}

所以我会使用这样的脚本：

//instantiate the class
foo = new someClass();

//get the information from the server
//and the processAjax function will eventually
//call the doSomething function
foo.getAjax();

所以我真的不喜欢这个，因为在使用脚本时发生的事情并不清楚。我希望能够做到这样的事情：

//instantiate the class
foo = new someClass();

//get info from the server
//in this example, the processAJAX function will not call the doSomething
foo.getAjax();

//do something
foo.doSomething();

然而这不起作用，因为通常来自服务器的响应需要一些时间，因此当调用doSomething时，还没有必要的信息，因此，该函数不会按预期执行。

如何使这项工作？

我确定答案已经在StackOverflow上的某个地方，但是我找不到任何东西，所以我会很感激，无论是答案还是链接到可以解释这个问题的资源，可以在StackOverflow上找到。任何帮助表示赞赏。谢谢。

Answer 1

这样做的标准模式是接受异步方法的回调函数，该类负责在操作完成时进行调用。

function someclass() {
    this.getAJAX = function(callback) {
        this.afterAJAXCallback = callback;
        ...
    });

    this.processAJAX = function(data) {
        ...
        if (this.afterAJAXCallback) this.afterAJAXCallback();
    }
}

然后你可以使用一个闭包回调来构造你的代码，就像你使用jQuery的$ .ajax一样：

foo = new someClass();
foo.getAjax(function() {
    foo.doSomething();
});

Answer 2

听起来你想要一个ajax事件监听器或回调。做一些搜索，你会找到一些解决方案。其中很多都是基于jQuery的，但如果不适合你的应用程序，它肯定可以在没有jQuery的情况下完成。

对于jQuery，相关文档位于http://api.jquery.com/jQuery.ajax/。它不会将其称为事件监听器，但请参阅有关context的部分和succes的回调。

另一种可能性是同步而不是异步执行ajax调用。（再次，做一些搜索，你会发现很多东西。）如果你走这条路，你要小心确保同步调用基本上没有挂起你的应用等待响应。

Answer 3

如果您使用XMLHttpRequest() synchronous，则可以按照自己喜欢的方式进行操作。

如何制作一个有效的基于Ajax的javascript脚本

3 个答案: