我正在尝试创建 JavaScript“类”或对象的多个实例,但它似乎充当单例...有人可以帮助我使用以下代码吗?
(function() {
/*
* Canvas object
*/
var Canvas = function( el ) {
_self = this;
_self.el = el;
}
Canvas.prototype.init = function() {
_self.el.style.backgroundColor = "#000";
_self.el.addEventListener( "mousedown", _self.onMouseDown );
}
Canvas.prototype.onMouseDown = function() {
console.log( 'onMouseDown: ', _self.el );
}
var cOne = new Canvas( document.getElementById('one') );
var cTwo = new Canvas( document.getElementById('two') );
cOne.init();
cTwo.init();
})();
最佳答案
当变量声明中不使用var
时,它就成为全局变量。因此,当您创建新实例时,它会更新全局变量。
此方法的另一种方法是简单地将 el
设为对象属性:
var Canvas = function(el) {
this.el = el;
};
<小时/>
此外,您应该考虑将 .onMouseDown
方法绑定(bind)到当前对象。改用这个:
this.el.addEventListener(..., this.onMouseDown.bind(this));
或者这个:
Canvas.prototype.init = function() {
var self = this;
...
this.el.addEventListener(..., function() {
self.onMouseDown.call(self);
});
};
关于JavaScript 多实例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14742168/