原型模式(prototype)是指用原型實(shí)例指向創(chuàng)建對象的種類,并且通過拷貝這些原型創(chuàng)建新的對象。
對于原型模式,我們可以利用 JavaScript 特有的原型繼承特性去創(chuàng)建對象的方式,也就是創(chuàng)建的一個(gè)對象作為另外一個(gè)對象的 prototype 屬性值。原型對象本身就是有效地利用了每個(gè)構(gòu)造器創(chuàng)建的對象,例如,如果一個(gè)構(gòu)造函數(shù)的原型包含了一個(gè) name 屬性(見后面的例子),那通過這個(gè)構(gòu)造函數(shù)創(chuàng)建的對象都會有這個(gè)屬性。
在現(xiàn)有的文獻(xiàn)里查看原型模式的定義,沒有針對 JavaScript 的,你可能發(fā)現(xiàn)很多講解的都是關(guān)于類的,但是現(xiàn)實(shí)情況是基于原型繼承的 JavaScript 完全避免了類(class)的概念。我們只是簡單從現(xiàn)有的對象進(jìn)行拷貝來創(chuàng)建對象。
真正的原型繼承是作為最新版的 ECMAScript5 標(biāo)準(zhǔn)提出的,使用 Object.create 方法來創(chuàng)建這樣的對象,該方法創(chuàng)建指定的對象,其對象的 prototype 有指定的對象(也就是該方法傳進(jìn)的第一個(gè)參數(shù)對象),也可以包含其他可選的指定屬性。例如 Object.create(prototype, optionalDescriptorObjects),下面的例子里也可以看到這個(gè)用法:
// 因?yàn)椴皇菢?gòu)造函數(shù),所以不用大寫
var someCar = {
drive: function () { },
name: '馬自達(dá) 3'
};
// 使用Object.create創(chuàng)建一個(gè)新車x
var anotherCar = Object.create(someCar);
anotherCar.name = '豐田佳美';
Object.create 運(yùn)行你直接從其它對象繼承過來,使用該方法的第二個(gè)參數(shù),你可以初始化額外的其它屬性。例如:
var vehicle = {
getModel: function () {
console.log('車輛的模具是:' + this.model);
}
};
var car = Object.create(vehicle, {
'id': {
value: MY_GLOBAL.nextId(),
enumerable: true // 默認(rèn)writable:false, configurable:false
},
'model': {
value: '福特',
enumerable: true
}
});
這里,可以在 Object.create 的第二個(gè)參數(shù)里使用對象字面量傳入要初始化的額外屬性,其語法與 Object.defineProperties 或 Object.defineProperty 方法類型。它允許您設(shè)定屬性的特性,例如 enumerable,writable 或 configurable。
如果你希望自己去實(shí)現(xiàn)原型模式,而不直接使用 Object.create。你可以使用像下面這樣的代碼為上面的例子來實(shí)現(xiàn):
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 的,就不多說了,這里大家要注意的依然是淺拷貝和深拷貝的問題,免得出現(xiàn)引用問題。