Question

我有这个代码用于对web服务执行ajax请求：

var MyCode = {
    req: new XMLHttpRequest(), // firefox only at the moment

    service_url: "http://url/to/Service.asmx",

    sayhello: function() {
        if (this.req.readyState == 4 || this.req.readyState == 0) {
            this.req.open("POST", this.service_url + '/HelloWorld', true);
            this.req.setRequestHeader('Content-Type','application/json; charset=utf-8');
            this.req.onreadystatechange = this.handleReceive; 
            var param = '{}';
            this.req.send(param);
        }
    },

    handleReceive: function() {
        if (this.req.readyState == 4) {
            // todo: using eval for json is dangerous
            var response = eval("(" + this.req.responseText + ")");
            alert(response);
        }
    }
}

当然是用MyCode.sayhello（）来调用它。

它的问题是handleReceive函数的第一行“req未定义”。它被调用4次，所以我知道上面的代码将请求发送到服务器。

我该如何解决这个问题？

Answer 1

经典封闭问题。当你得到回调时，闭包实际上已经引用了HTTP对象。

您可以按照某人的建议执行以下操作：

var that = this;
this.req.onreadystatechange = function() { this.handleReceive.apply(that, []); };

或者只需执行以下操作：

var that = this;
this.req.onreadystatechange = function() { that.handleReceive(); };

Answer 2

你可以通过在MyCode中引用一个变量来解决这个问题。像

var MyCode = {
    req: new XMLHttpRequest(), // firefox only at the moment

    self = this

    ...
}

然后你可以参考自我而不是这个。

Answer 3

改变这个：

this.req.onreadystatechange = this.handleReceive;

到此：

var self = this;
this.req.onreadystatechange = function() { self.handleReceive(); }

这会创建一个应该解决问题的闭包。

Answer 4

你应该能够通过改变

使其发挥作用

this.req.onreadystatechange = this.handleReceive;

到

var that = this;
this.req.onreadystatechange = function() { this.handleReceive.apply(that, []); };

Function.prototype.apply可用于在显式this和函数参数的情况下调用函数。

回调函数中'this'的值

4 个答案: