## 介绍
原型模式(prototype)是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象。
## 正文
对于原型模式,我们可以利用JavaScript特有的原型继承特性去创建对象的方式,也就是创建的一个对象作为另外一个对象的prototype属性值。原型对象本身就是有效地利用了每个构造器创建的对象,例如,如果一个构造函数的原型包含了一个name属性(见后面的例子),那通过这个构造函数创建的对象都会有这个属性。
在现有的文献里查看原型模式的定义,没有针对JavaScript的,你可能发现很多讲解的都是关于类的,但是现实情况是基于原型继承的JavaScript完全避免了类(class)的概念。我们只是简单从现有的对象进行拷贝来创建对象。
真正的原型继承是作为最新版的ECMAScript5标准提出的,使用Object.create方法来创建这样的对象,该方法创建指定的对象,其对象的prototype有指定的对象(也就是该方法传进的第一个参数对象),也可以包含其他可选的指定属性。例如Object.create(prototype, optionalDescriptorObjects),下面的例子里也可以看到这个用法:
~~~
// 因为不是构造函数,所以不用大写
var someCar = {
drive: function () { },
name: '马自达 3'
};
// 使用Object.create创建一个新车x
var anotherCar = Object.create(someCar);
anotherCar.name = '丰田佳美';
~~~
Object.create运行你直接从其它对象继承过来,使用该方法的第二个参数,你可以初始化额外的其它属性。例如:
~~~
var vehicle = {
getModel: function () {
console.log('车辆的模具是:' + this.model);
}
};
var car = Object.create(vehicle, {
'id': {
value: MY_GLOBAL.nextId(),
enumerable: true // 默认writable:false, configurable:false
},
'model': {
value: '福特',
enumerable: true
}
});
~~~
这里,可以在Object.create的第二个参数里使用对象字面量传入要初始化的额外属性,其语法与Object.defineProperties或Object.defineProperty方法类型。它允许您设定属性的特性,例如enumerable, writable 或 configurable。
如果你希望自己去实现原型模式,而不直接使用Object.create 。你可以使用像下面这样的代码为上面的例子来实现:
~~~
var vehiclePrototype = {
init: function (carModel) {
this.model = carModel;
},
getModel: function () {
console.log('车辆模具是:' + this.model);
}
};
function vehicle(model) {
function F() { };
F.prototype = vehiclePrototype;
var f = new F();
f.init(model);
return f;
}
var car = vehicle('福特Escort');
car.getModel();
~~~
## 总结
原型模式在JavaScript里的使用简直是无处不在,其它很多模式有很多也是基于prototype的,就不多说了,这里大家要注意的依然是浅拷贝和深拷贝的问题,免得出现引用问题。
- (1)编写高质量JavaScript代码的基本要点
- (2)揭秘命名函数表达式
- (3)全面解析Module模式
- (4)立即调用的函数表达式
- (5)强大的原型和原型链
- (6)S.O.L.I.D五大原则之单一职责SRP
- (7)S.O.L.I.D五大原则之开闭原则OCP
- (8)S.O.L.I.D五大原则之里氏替换原则LSP
- (9)根本没有“JSON对象”这回事!
- (10)JavaScript核心(晋级高手必读篇)
- (11)执行上下文(Execution Contexts)
- (12)变量对象(Variable Object)
- (13)This? Yes, this!
- (14)作用域链(Scope Chain)
- (15)函数(Functions)
- (16)闭包(Closures)
- (17)面向对象编程之一般理论
- (18)面向对象编程之ECMAScript实现
- (19)求值策略
- (20)《你真懂JavaScript吗?》答案详解
- (21)S.O.L.I.D五大原则之接口隔离原则ISP
- (22)S.O.L.I.D五大原则之依赖倒置原则DIP
- (23)JavaScript与DOM(上)——也适用于新手
- (24)JavaScript与DOM(下)
- (25)设计模式之单例模式
- (26)设计模式之构造函数模式
- (27)设计模式之建造者模式
- (28)设计模式之工厂模式
- (29)设计模式之装饰者模式
- (30)设计模式之外观模式
- (31)设计模式之代理模式
- (32)设计模式之观察者模式
- (33)设计模式之策略模式
- (34)设计模式之命令模式
- (35)设计模式之迭代器模式
- (36)设计模式之中介者模式
- (37)设计模式之享元模式
- (38)设计模式之职责链模式
- (39)设计模式之适配器模式
- (40)设计模式之组合模式
- (41)设计模式之模板方法
- (42)设计模式之原型模式
- (43)设计模式之状态模式
- (44)设计模式之桥接模式
- (45)代码复用模式(避免篇)
- (46)代码复用模式(推荐篇)
- (47)对象创建模式(上篇)
- (48)对象创建模式(下篇)
- (49)Function模式(上篇)
- (50)Function模式(下篇)
- (结局篇)