引用“this"在对象原型方法中的setInterval/setTimeout
Referencing "this" inside setInterval/setTimeout within object prototype methods
通常,当在setInterval中引用"this"时,我会指定一个替代的"self"引用。是否有可能在原型方法的上下文中完成类似的事情?下面的代码出错。
function Foo() {}
Foo.prototype = {
bar: function () {
this.baz();
},
baz: function () {
this.draw();
requestAnimFrame(this.baz);
}
};
与Python等语言不同,Javascript方法在提取它并将其传递到其他地方后会忘记它是一个方法。
将方法调用包装在匿名函数中
这样,访问baz
属性和调用它同时发生,这对于在方法调用中正确设置this
是必要的。
您需要将外部函数中的this
保存在辅助变量中,因为内部函数将引用不同的this
对象。
var that = this;
setInterval(function(){
return that.baz();
}, 1000);
将方法调用封装在一个胖箭头函数中
在实现箭头函数特性的Javascript实现中,可以通过使用胖箭头语法以更简洁的方式编写上述解决方案:
setInterval( () => this.baz(), 1000 );
Fat arrow匿名函数将this
与周围函数保持一致,因此不需要使用var that = this
技巧。要查看是否可以使用此功能,请参考如下的兼容性表。
使用绑定函数
最后一种选择是使用function .prototype.bind之类的函数或你喜欢的Javascript库中的等效函数。
setInterval( this.baz.bind(this), 1000 );
//dojo toolkit example:
setInterval( dojo.hitch(this, 'baz'), 100);
我创建了一个代理类:)
function callback_proxy(obj, obj_method_name)
{
instance_id = callback_proxy.instance_id++;
callback_proxy.instances[instance_id] = obj;
return eval('fn = function() { callback_proxy.instances['+instance_id+'].'+obj_method_name+'(); }');
}
callback_proxy.instance_id = 0;
callback_proxy.instances = new Array();
function Timer(left_time)
{
this.left_time = left_time; //second
this.timer_id;
this.update = function()
{
this.left_time -= 1;
if( this.left_time<=0 )
{
alert('fin!');
clearInterval(this.timer_id);
return;
}
}
this.timer_id = setInterval(callback_proxy(this, 'update'), 1000);
}
new Timer(10);
相关文章:
- 从setInterval方法移动到带有sprite的requestAnimationFrame
- setInterval 只在对象方法上运行一次
- 是否可以对超出范围的 setInterval 变量调用 clearInterval 方法
- 关于性能,最好的方法是什么:setInterval()或body上的全局事件
- 对象中的setInterval出现问题's方法
- 我可以在setInterval函数中放入一个方法作为参数吗
- setTimeOut() 或 setInterval() .4种方法应用相同的东西.哪个是最好的
- 不能使用 javaScript setInterval 方法
- 通过匿名函数使用 setInterval 的更好方法
- 如何在 setInterval() 方法之后设置“stop”
- setInterval() 对象的方法调用
- 如何从一个函数调用 clearInterval() 方法以停止另一个函数中的 setInterval() 方法
- 其他方法使用 setInterval 调用的方法无法访问 js 中的对象属性
- 随着时间的推移,JavaScript 的 setInterval() 方法运行是否会消耗明显的处理能力
- JavaScript 中的计时:找到一种使 setInterval 替代时间的方法
- 如何格式化setInterval方法JavaScript的运行时间
- 使用SetInterval()调用Javascript对象方法
- 有没有更好的方法可以在不使用setInterval的情况下创建异步更新
- clearInterval在包含setInterval的方法之外
- 正在退出javascript中的setInterval方法