javascript是一种面线对象的编程语言(OOP),但是js和其他面向类语言不同,js中并没有类的概念,但是大多数开发人员都熟悉了类的概念,想方设法在js中加入类的概念,于是就出现了很多类的设计模式,我想说的是,这些设计模式在某些方面也许加快了我们的开发速度,但是却给我们带来严重的不良后果,比如代码维护等等。
实际上,js中已经有一些语法是利用来实现类似类的功能,这就是原型,prototype,可以说js是面向原型的,而原型其实是提供了一种面向委托关联的编程方式。这种编程方式对js开发人员来说非常容易上手。且不会涉及到很多复杂的关系,这点不同面向类的编程方式。
下面是两个通过面向委托关联编程模式实现的应用实例
MYJS.dom.Widget = {
init: function (width,height) {
this.width = width;
this.height =height;
},
insert: function ($where) {
if(this.$elem){
this.$elem.css({
width:this.width + 'px',
height:this.height + 'px'
}).appendTo($where);
}
}
}
var Button = Object.create(Widget);
Button.setup = function (width,height,label) {
this.init(width,height);
this.label = label || 'Default';
this.$elem = $("button").text(this.label);
}
Button.build = function ($where) {
this.insert($where);
this.$elem.click(this.onClick.bind(this));
}
Button.onClick = function (evt) {
console.log('button ' + this.label + ' clicked!');
}
$(document).read(function () {
var $body = $(document.body);
var btn1 = Object.create(Button);
btn1.setup(125, 30, 'Hello');
var btn2 = Object.create(Button);
btn1.setup(150, 40, 'World');
btn1.build($body);
btn2.build($body);
});