javascript - 使用对象方法作为 AJAX 调用的回调

Question

我有一个名为 Company 的 javascript 对象，它可能会被实例化多次。

我希望每个公司处理自己与服务器的通信，以便其 ajax 调用将包含在类中。

到目前为止我已经:

Company = new Object();
Company.SendData = function(){
        $.ajax({
            type: "POST",
            url: "<some url>",
            data: <some data>,
            dataType: "json",
            success: this.ReceiveData,
            error: ErrorFunc
        });
}
Company.ReceiveData = function(data){
    alert("Received some data");
}

Ajax工作正常，服务器正确接收数据并返回响应，但回调函数没有触发。

我的猜测是因为它不再有任何关于“这个”是什么的引用框架。

有没有办法可以将函数附加到类的单个实例？

Answer 1

对于如何解决此问题，有多种不同的选择。问题的关键在于，您需要在调用回调时正确设置 this 的值，因为默认情况下它是不正确的。

在现代浏览器中，您可以使用广泛有用的 .bind():

Company = new Object();
Company.SendData = function(){
        $.ajax({
            type: "POST",
            url: "<some url>",
            data: <some data>,
            dataType: "json",
            success: this.ReceiveData.bind(this),
            error: ErrorFunc
        });
}
Company.ReceiveData = function(data){
    alert("Received some data");
}

或者，您可以使用 $.ajax() 的 context 选项来指示 jQuery 为您完成这项工作:

Company = new Object();
Company.SendData = function(){
        $.ajax({
            type: "POST",
            url: "<some url>",
            data: <some data>,
            dataType: "json",
            context: this,
            success: this.ReceiveData,
            error: ErrorFunc
        });
}
Company.ReceiveData = function(data){
    alert("Received some data");
}

或者您可以使用 this 的保存值创建自己的 stub 函数(这是我最不喜欢的选项):

Company = new Object();
Company.SendData = function(){
        var self = this;
        $.ajax({
            type: "POST",
            url: "<some url>",
            data: <some data>,
            dataType: "json",
            success: function(result) {return self.ReceiveData(result);},
            error: ErrorFunc
        });
}
Company.ReceiveData = function(data){
    alert("Received some data");
}