我需要this从我的setInterval处理程序访问
prefs: null,
startup : function()
{
// init prefs
...
this.retrieve_rate();
this.intervalID = setInterval(this.retrieve_rate, this.INTERVAL);
},
retrieve_rate : function()
{
var ajax = null;
ajax = new XMLHttpRequest();
ajax.open('GET', 'http://xyz.com', true);
ajax.onload = function()
{
// access prefs here
}
}
如何访问 this.prefs ajax.onload？
this.intervalID = setInterval(this.retrieve_rate.bind(this), this.INTERVAL);
setInterval 行应如下所示：-
this.intervalID = setInterval(
(function(self) { //Self-executing func which takes 'this' as self
return function() { //Return a function in the context of 'self'
self.retrieve_rate(); //Thing you wanted to run as non-window 'this'
}
})(this),
this.INTERVAL //normal interval, 'this' scope not impacted here.
);
编辑：同样的原则适用于“ onload”。在这种情况下，“外部”代码通常做的很少，它只是设置请求然后发送它。在这种情况下，不需要额外的开销，如上述代码中的附加功能。您的retrieve_rate 应该看起来更像这样：-
retrieve_rate : function()
{
var self = this;
var ajax = new XMLHttpRequest();
ajax.open('GET', 'http://xyz.com', true);
ajax.onreadystatechanged= function()
{
if (ajax.readyState == 4 && ajax.status == 200)
{
// prefs available as self.prefs
}
}
ajax.send(null);
}
的默认行为setInterval是绑定到全局上下文。您可以通过保存当前上下文的副本来调用成员函数。在retrieve_rate 中，this变量将正确绑定到原始上下文。您的代码如下所示：
var self = this;
this.intervalID = setInterval(
function() { self.retrieve_rate(); },
this.INTERVAL);
额外提示：对于普通函数引用（与具有成员函数的对象引用相对），您可以使用 JavaScriptcall或apply方法更改上下文。
随着浏览器支持的改进，=>现在是时候使用EcmaScript 6 增强，即箭头方法来this正确保存了。
startup : function()
{
// init prefs
...
this.retrieve_rate();
this.intervalID = setInterval( () => this.retrieve_rate(), this.INTERVAL);
},
使用=>方法保留this时retrieve_rate()由间隔调用。不需要时髦的自我或传入this参数
window.setInterval(function(){console.log(this)}.bind(this), 100)
这在 javascript 中是合法的，并且可以节省大量代码 :)