javascript 如何将“this”传递给窗口 setInterval
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10944004/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to pass "this" to window setInterval
提问by NSF
Suppose I have a function a:
假设我有一个函数 a:
function a() {
this.b = 1;
this.set = setInterval(function() {console.log(this.b);}, 200);
}
So when a.set() is called the anonymous function will be called. But this won't work as this at that time when the function is triggered points to the window object. Also it's not a good idea to use a.b as there may be multiple instances of a.
所以当 a.set() 被调用时,匿名函数将被调用。但是当函数被触发指向 window 对象时,这将不起作用。此外,使用 ab 也不是一个好主意,因为 a 可能有多个实例。
What is a good solution to this problem?
这个问题有什么好的解决办法?
回答by nnnnnn
Store a reference to this
:
存储对 的引用this
:
function a() {
var self = this;
self.b = 1;
self.set = setInterval(function() {console.log(self.b);}, 200);
}
The anonymous function that you pass to setInterval
has access to any variables in its containing scope, i.e., any local variables of function a()
. The magic of JS closures keeps these variables alive even after a()
has completed, and each invocation of a()
gets its own closure.
您传递给的匿名函数可以setInterval
访问其包含范围内的任何变量,即function a()
. JS 闭包的神奇之处在于,即使这些变量a()
已经完成,也能保持它们的活动状态,并且每次调用a()
都有自己的闭包。
回答by Lux
Since we have ES6 now, I think we need another answer here:
既然我们现在有了 ES6,我想我们在这里需要另一个答案:
Use an arrow function:
使用箭头函数:
function a() {
this.b = 1;
this.set = setInterval(() => {console.log(this.b);}, 200);
}
Arrow functions, opposite to normal functions, don't have a this
context on their own. This means you have access to the outer this
.
与普通函数相反,箭头函数this
本身没有上下文。这意味着您可以访问外部this
.
回答by Dbl
This would be the cleanest solution, since most of the time you actually want to switch the this context for your consecutive method calls:
这将是最干净的解决方案,因为大多数时候您实际上希望为连续的方法调用切换 this 上下文:
// store scope reference for our delegating method
var that = this;
setInterval(function() {
// this would be changed here because of method scope,
// but we still have a reference to that
OURMETHODNAME.call(that);
}, 200);
回答by Sirko
Just save your this
reference in some other variable, that is not overridden by the window
-call later on. Later you can use that variable to reference he object you started with.
只需将您的this
引用保存在其他变量中,window
稍后不会被-call覆盖。稍后您可以使用该变量来引用您开始使用的对象。
function a() {
this.b = 1;
var that = this;
this.set = setInterval(function() {console.log(that.b);}, 200);
}
回答by Jeffrey Zhao
In your case, you can simply:
在您的情况下,您可以简单地:
function a() {
var _this = this;
this.b = 1;
this.set = setInterval(function () {
console.log(_this.b);
}, 200);
}
Normally, we can also have a helper method Function.prototype.bind
to fixthe this
reference.
通常情况下,我们还可以有一个辅助方法Function.prototype.bind
来修复的this
参考。
回答by Smily
This question is waay too old, but I did not like the solutions in here as the idea has mostly been about attaching the instance to something public.
这个问题太老了,但我不喜欢这里的解决方案,因为这个想法主要是将实例附加到public。
Here is another, working idea:
这是另一个可行的想法:
The problem is that when calling as a callback from an interval, the scope is not inside this
. However, you can kinda force it to be by defining a Function variable.
问题是,当从一个区间作为回调调用时,范围不在this
. 但是,您可以通过定义 Function 变量来强制它。
function a() {
var localCallback: () => {
// access `this` as you will
console.log(this);
};
this.timer = setInterval( localCallback, this.saveInterval );
}
Hope this is helpful!
希望这是有帮助的!