原型模式:html
原型模式是指原型實例指向建立對象的種類,並經過拷貝這些原型建立新的對象,是一種用來建立對象的模式,也就是建立一個對象做爲另外一個對象的prototype屬性;函數
prototype警告:學習瞭解原型模式前需先學習原型、原型鏈、prototype、__proto__、constructor等知識;(http://www.javashuo.com/article/p-umuhfijn-ey.html)學習
實現原型模式:this
ES5中的API:Object.create(prototype, optionalDescriptorObjects)spa
Object.create()方法接收兩個參數:第一個參數是__proto__對象,第二個是prototiesObject(可選,使用第二個參數能夠初始化額外的其餘屬性,接受字面量對象形式);prototype
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;code
第二個參數中初始化了"model"的值,將model的值初始化爲了"法拉利",因此此時新建立的對象vehiclePrototype中只有一個model,值爲"法拉利";htm
不用Object.create()實現,用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中,咱們先建立了一個新的構造函數,而後將該函數的原型指向vehiclePrototype,而後進行實例化該函數,最後繼承以後調用prototype上的init方法,最後將執行結果進行返回也是一樣能夠實現的;blog
原型模式在JavaScript中無處不在,其餘模式中有不少也是基於prototype來實現的,因此好好學習、複習原型和原型鏈的知識很重要,重點是prototype、__proto__、constructor等關鍵屬性知識點;