2

上这堂课：

var MyClass = new Class({
    Implements: [Events, Options],
    initialize: function() {

        this.a = 1;

    },

    myMethod: function() {

        var mc = new differentClass({
            events: {
                onClick: function() {

                    console.log(this.a); // undefined (should be 1, 2, 3 etc)

                    this.a ++;


                }
            }
        });    

    }
});

我如何保持this.a的价值？我基本上是在尝试从最后一点到刚刚单击的坐标画一条线（使用画布）。

[编辑]

我不想绑定this，因为它显然很糟糕，它会覆盖differentClass选项。

4

2 回答 2

4

有几种模式可供选择。

装饰器通过.bind()

var mc = new differentClass({
    events: {
        click: function() {
             console.log(this.a);
             this.a ++;
        }.bind(this) // binds the scope of the function to the upper scope (myclass)
    }
});

保持参考。

var self = this; // reference parent instance of myClass
var mc = new differentClass({
    events: {
        click: function() {
             console.log(self.a); 
             self.a ++;
        }
    }
});

指向一个可以处理它的 myClass 方法：

handleClick: function() {
    this.a++;
},
myMethod: function() {
    var mc = new differentClass({
        events: {
            click: this.handleClick.bind(this)
        }
    });    
}

第二个 - 通过存储引用是首选，因为占用空间更小且支持通用，.bind但并非在每个浏览器中都可用，并且需要填充以及额外的时间来在执行时对函数进行curry。

self如果可能，您会在 mootools-core 本身中找到它。

如果性能没有风险，方法 3 可能会提供最好的可读性和代码结构。该方法的参数将保留单击处理程序传递的内容，即event并且event.target将成为处理程序。

在模式 #2 中，带有self,this将指向匿名函数中的点击处理程序（或指向其他类，例如），这可能也很有用 - 重新绑定上下文可能会让人头疼

于 2012-04-30T14:46:41.693 回答
2

您可以像这样引用适当的上下文：

...
myMethod: function() {
    var _this = this;
    var mc = new differentClass({
        events: {
            onClick: function() {
                console.log(_this.a);
                _this.a ++;
            }
        }
    });    
}
...
于 2012-04-30T14:46:05.730 回答