[英]Invoke a javascript object method from within a callback
我在用户脚本中定义了以下MyClass
及其方法:
function MyClass() {
this.myCallback = function() {
alert("MyClass.myCallback()");
};
this.startRequest = function() {
GM_xmlhttpRequest({
'method': 'GET',
'url': "http://www.google.com/",
'onload': function (xhr) {
myClassInstance.myCallback();
}
});
};
}
var myClassInstance = new MyClass();
myClassInstance.startRequest();
该脚本有效,一旦GM_xmlhttpRequest完成,就会调用myCallback()
方法。
但是,它仅起作用是因为onload
回调引用了全局变量myClassInstance
。 如果我将onload
回调更新为:
'onload': function (xhr) {
this.myCallback();
}
然后我收到(Chrome)错误:
未捕获的类型错误:对象 [对象 DOMWindow] 没有方法“myCallback”。
似乎this
是在错误的上下文中进行评估的。
有没有一种方法来调用myCallback()
的方法myClassInstance
,而不必诉诸使用全局变量?
当它在范围内时,将正确的this
保存到一个变量中。 然后你可以稍后参考它:
this.startRequest = function() {
var myself = this;
GM_xmlhttpRequest({
'method': 'GET',
'url': "http://www.google.com/",
'onload': function (xhr) {
myself.myCallback();
}
});
};
正如已经指出的,最简单的解决方案是为保持在作用域内的this
创建一个别名。 别名最流行的变量名称是self
或that
类的东西,但实际上任何东西都有效。
另一种选择(可能更好也可能不会更好,取决于用例)是将方法绑定到“普通”函数并使用它:
var f = this.callback.bind(this);
...
'onload': function(){
f();
}
旧浏览器不支持绑定,但您可以在许多 JS 框架中找到替代方案。 我给出的例子看起来不太好,但是当你想直接将你的方法作为回调函数传递时它会非常方便(你也可能得到部分函数应用程序,这非常简洁)
存储对实例的引用并使用它:
function MyClass() {
this.myCallback = function() {
alert("MyClass.myCallback()");
};
var instance = this;
instance.startRequest = function() {
GM_xmlhttpRequest({
'method': 'GET',
'url': "http://www.google.com/",
'onload': function (xhr) {
instance.myCallback();
}
});
};
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.