設(shè)計(jì)模式之工廠模式

來源 | 看云
介紹
正文
var Car = (function () {var Car = function (model, year, miles) {this.model = model;this.year = year;this.miles = miles;};return function (model, year, miles) {return new Car(model, year, miles);};})();var tom = new Car("Tom", 2009, 20000);var dudu = new Car("Dudu", 2010, 5000);
不好理解的話,我們?cè)俳o一個(gè)例子:
var productManager = {};productManager.createProductA = function () {console.log('ProductA');}productManager.createProductB = function () {console.log('ProductB');}productManager.factory = function (typeType) {return new productManager[typeType];}productManager.factory("createProductA");
如果還不理解的話,那我們就再詳細(xì)一點(diǎn)咯,假如我們想在網(wǎng)頁(yè)面里插入一些元素,而這些元素類型不固定,可能是圖片,也有可能是連接,甚至可能是文本,根據(jù)工廠模式的定義,我們需要定義工廠類和相應(yīng)的子類,我們先來定義子類的具體實(shí)現(xiàn)(也就是子函數(shù)):
var page = page || {};page.dom = page.dom || {};//子函數(shù)1:處理文本page.dom.Text = function () {this.insert = function (where) {var txt = document.createTextNode(this.url);where.appendChild(txt);};};//子函數(shù)2:處理鏈接page.dom.Link = function () {this.insert = function (where) {var link = document.createElement('a');link.href = this.url;link.appendChild(document.createTextNode(this.url));where.appendChild(link);};};//子函數(shù)3:處理圖片page.dom.Image = function () {this.insert = function (where) {var im = document.createElement('img');im.src = this.url;where.appendChild(im);};};
那么我們?nèi)绾味x工廠處理函數(shù)呢?其實(shí)很簡(jiǎn)單:
page.dom.factory = function (type) {return new page.dom[type];}
使用方式如下:
var o = page.dom.factory('Link');o.url = 'http://www.cnblogs.com';o.insert(document.body);
至此,工廠模式的介紹相信大家都已經(jīng)了然于心了,我就不再多敘述了。
總結(jié)
什么時(shí)候使用工廠模式
以下幾種情景下工廠模式特別有用:
對(duì)象的構(gòu)建十分復(fù)雜
需要依賴具體環(huán)境創(chuàng)建不同實(shí)例
處理大量具有相同屬性的小對(duì)象
什么時(shí)候不該用工廠模式
不濫用運(yùn)用工廠模式,有時(shí)候僅僅只是給代碼增加了不必要的復(fù)雜度,同時(shí)使得測(cè)試難以運(yùn)行下去。
推薦閱讀
編寫高質(zhì)量JavaScript代碼的基本要點(diǎn)
JavaScript設(shè)計(jì)模式之構(gòu)造函數(shù)模式
本文完~

評(píng)論
圖片
表情
