原型模式:
原型模式是指原型實例指向創(chuàng)建對象的種類,并通過拷貝這些原型創(chuàng)建新的對象,是一種用來創(chuàng)建對象的模式,也就是創(chuàng)建一個對象作為另一個對象的prototype屬性;
prototype警告:學習了解原型模式前需先學習原型、原型鏈、prototype、proto、constructor等知識;(https://www.cnblogs.com/dengyao-blogs/p/11481326.html)
實現(xiàn)原型模式:
ES5中的API:Object.create(prototype, optionalDescriptorObjects)
Object.create()方法接收兩個參數(shù):第一個參數(shù)是proto對象,第二個是prototiesObject(可選,使用第二個參數(shù)可以初始化額外的其他屬性,接受字面量對象形式);
var vehiclePrototype = {
model:"保時捷",
getModel: function () {
console.log('車輛模具是:' + this.model);
}
};
var vehicle = Object.create(vehiclePrototype,{
"model":{
value:"法拉利"
}
});
vehicle.getModel(); //車輛模具是:法拉利
我們使用Object.create實際上是新建了一個對象vehiclePrototype,并且繼承了vehiclePrototype的方法,所以此時vehicle.proto == vehiclePrototype;
第二個參數(shù)中初始化了"model"的值,將model的值初始化為了"法拉利",所以此時新創(chuàng)建的對象vehiclePrototype中只有一個model,值為"法拉利";
不用Object.create()實現(xiàn),用prototype:
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('法拉利');
car.getModel(); // 車輛模具是:法拉利
上述代碼中,我們可以看到核心是在vehicle中,我們先創(chuàng)建了一個新的構造函數(shù),然后將該函數(shù)的原型指向vehiclePrototype,然后進行實例化該函數(shù),最后繼承之后調用prototype上的init方法,最后將執(zhí)行結果進行返回也是同樣可以實現(xiàn)的;
原型模式在JavaScript中無處不在,其他模式中有很多也是基于prototype來實現(xiàn)的,所以好好學習、復習原型和原型鏈的知識很重要,重點是prototype、proto、constructor等關鍵屬性知識點;