在对象原型方法中引用setInterval / setTimeout中的“this”

Question

通常我会在setInterval中引用“this”时指定一个替代的“self”引用。是否有可能在原型方法的上下文中完成类似的事情？以下代码错误。

function Foo() {}

Foo.prototype = {

    bar: function () {

        this.baz();

    },

    baz: function () {

        this.draw();

        requestAnimFrame(this.baz);

    }

};

Answer 1

与Python之类的语言不同，Javascript方法会在您将其提取并将其传递到其他位置后忘记它。你也可以将方法调用包装在匿名函数中这样，访问baz属性并同时调用它，这是this在方法调用中正确设置所必需的。您需要this将外部函数保存在辅助变量中，因为内部函数将引用另一个this对象。var that = this;setInterval(function(){    return that.baz();}, 1000);将方法调用包含在胖箭头函数中在实现箭头函数功能的Javascript实现中，可以使用胖箭头语法以更简洁的方式编写上述解决方案：setInterval( () => this.baz(), 1000 );胖箭头匿名函数保留了this周围的函数，因此不需要使用该var that = this技巧。要查看是否可以使用此功能，请参阅此类兼容性表。使用绑定功能最后一种方法是使用Function.prototype.bind等函数或您喜欢的Javascript库中的等效函数。setInterval( this.baz.bind(this), 1000 );//dojo toolkit example:setInterval( dojo.hitch(this, 'baz'), 100);

Answer 2

我做了一个代理类:)function callback_proxy(obj, obj_method_name){&nbsp; &nbsp; instance_id = callback_proxy.instance_id++;&nbsp; &nbsp; callback_proxy.instances[instance_id] = obj;&nbsp; &nbsp; 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){&nbsp; &nbsp; this.left_time = left_time; //second&nbsp; &nbsp; this.timer_id;&nbsp; &nbsp; this.update = function()&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; this.left_time -= 1;&nbsp; &nbsp; &nbsp; &nbsp; if( this.left_time<=0 )&nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert('fin!');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; clearInterval(this.timer_id);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }&nbsp; &nbsp; this.timer_id = setInterval(callback_proxy(this, 'update'), 1000);}new Timer(10);