XMLHttpRequest对象上缺少onreadystatechange（）

Question

(function (send) { 

    XMLHttpRequest.prototype.send = function() { 

     console.log(this.onreadystatechange); //null 
     send.apply(this, arguments); 
    }; 

})(XMLHttpRequest.prototype.send); 

为什么this.onreadystatechange为空？根据this它应该存在并且类型为function。

Answer 1

onreadystatechange确实存在 ...这就是为什么它是null。如果它不存在，那将是undefined。这一切都取决于它是否已经设置。这显然已经是一个财产，因为它是null ...如果它不是，那将是undefined ...或至少"onreadystatechange" in this将是false。

下面是一个例子：

var a = new XMLHttpRequest(); 
a.onreadystatechange = function() { 
}; 
a.send(); 

您的控制台将记录一个function。

如果您有：

var b = new XMLHttpRequest(); 
b.send(); 

您的控制台将日志null。

这里有这种情况发生的演示：http://jsfiddle.net/3XKx7/

（我清楚地离开了其他步骤出了Ajax请求，这只是为了说明）

我不是想暗示有一个null和undefined之间的关系 - 我只是说在创建新的XMLHttpRequest时，onreadystatechange将在内部设置为null。无论您是否将其设置为功能，都取决于您。

UPDATE：

创建/发送XHR方式，一般是这样的顺序：

var xhr = new XMLHttpRequest(); 
xhr.onreadystatechange = function() { // This and `open` could be flip-flopped 
    // whatever 
}; 
xhr.open("POST", url, true); 
xhr.send("data=data"); 

我总是告诉/显示创建新XMLHttpRequest，那么无论设置onreadystatechange的顺序并打电话open，但只有在这两个应该我打电话send。

所以，如果总是做，onreadystatechange（如果实际设置）不会null并且将是一个function。

既然你提到你使用jQuery，我决定重写send方法像你想，并使一个jQuery $.ajax通话测试（不手动发送XMLHttpRequest）。下面是我的测试 - http://jsfiddle.net/3XKx7/1/

它没有意义，为什么onreadystatechange会null，因为jQuery 有是结合该事件，以请求和完成时的状态就知道了。所以我决定看看jQuery源代码。而我发现的是，他们称之为事物的顺序是：

xhr.open() 
xhr.send() 
xhr.onreadystatechange = function() { 

}; 

这意味着，当你重写send方法，onreadystatechange是null因为jQuery的不调用send之前设置它。我不知道他们的理由......可能是为了防止像你正在做的事情......但我从来没有听说过或看到这个惯例被使用。

所以你得到它的值作为null的原因是因为jQuery调用send后设置onreadystatechange。这意味着当您覆盖send并尝试访问onreadystatechange属性时，它尚未设置。

希望这是一个例子，可以帮助您了解：http://jsfiddle.net/dMP6q/16/

Answer 2

你应该自己设置它，当状态改变时这个函数会被调用。这就像其他的事件处理程序，如document.onload，yourelement.onclick等

古典你做

var httpRequest = new XMLHttpRequest(); 
    httpRequest.onreadystatechange = function() { 
     if (httpRequest.readyState === 4) { 
       if (httpRequest.status === 200) { 
        // use httpRequest.responseText 
       } 
     } 
    }; 
    httpRequest.open('GET', url); 
    httpRequest.send();