深入理解JavaScript系列（28）：設(shè)計模式之工廠模式詳解
介紹
與創(chuàng)建型模式類似，工廠模式創(chuàng)建對象（視為工廠里的產(chǎn)品）時無需指定創(chuàng)建對象的具體類。
工廠模式定義一個用于創(chuàng)建對象的接口，這個接口由子類決定實例化哪一個類。該模式使一個類的實例化延遲到了子類。而子類可以重寫接口方法以便創(chuàng)建的時候指定自己的對象類型。
這個模式十分有用，尤其是創(chuàng)建對象的流程賦值的時候，比如依賴于很多設(shè)置文件等。并且，你會經(jīng)常在程序里看到工廠方法，用于讓子類類定義需要創(chuàng)建的對象類型。
正文
下面這個例子中，是應(yīng)用了工廠方法對第26章構(gòu)造函數(shù)模式代碼的改進(jìn)版本：
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);
不好理解的話，我們再給一個例子：
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ì)一點咯，假如我們想在網(wǎng)頁面里插入一些元素，而這些元素類型不固定，可能是圖片，也有可能是連接，甚至可能是文本，根據(jù)工廠模式的定義，我們需要定義工廠類和相應(yīng)的子類，我們先來定義子類的具體實現(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ù)呢？其實很簡單：
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é)
什么時候使用工廠模式
以下幾種情景下工廠模式特別有用：
1.對象的構(gòu)建十分復(fù)雜
2.需要依賴具體環(huán)境創(chuàng)建不同實例
3.處理大量具有相同屬性的小對象
什么時候不該用工廠模式
不濫用運用工廠模式，有時候僅僅只是給代碼增加了不必要的復(fù)雜度，同時使得測試難以運行下去。
相關(guān)文章
屏蔽右鍵在某些特殊的情況下還是比較有用的，下面與大家分享個常用的屏蔽方法2014-05-05
bootstrap datetimepicker日期插件超詳細(xì)使用方法介紹
本篇文章主要介紹了bootstrap datetimepicker日期插件超詳細(xì)使用方法介紹，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
js控制臺報錯Uncaught TypeError: Cannot read p
本文主要介紹了js控制臺報錯Uncaught TypeError: Cannot read properties of undefined (reading ‘a(chǎn)ppendChild‘)的解決，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
這篇文章主要介紹了如何從對象數(shù)組中篩選符合條件的值，具有很好的參考價值，希望對大家有所幫助。2022-09-09
JavaScript Distilled 基礎(chǔ)知識與函數(shù)
JavaScript是一種動態(tài)的，弱類型的，基于原型的，面向?qū)ο蟮慕忉屝驼Z言。函數(shù)是JavaScript中的頭等公民。2010-04-04
wx:for是微信小程序中的一個列表渲染指令,用于循環(huán)渲染一個數(shù)組或?qū)ο笾械臄?shù)據(jù),它類似于JavaScript中的for循環(huán),可以根據(jù)數(shù)據(jù)的長度自動渲染相應(yīng)的列表項,本文給大家介紹微信小程序wx:for 的使用及wx:key綁定兩種方式,感興趣的朋友一起看看吧2023-12-12
布爾運算符 && 和 || 的時候，我說過它們的結(jié)果是布爾值，它們也能用于計算其他的類型的數(shù)據(jù)，這種時候，返回的就將是其中的一個參數(shù)了2013-11-11
Antd中Table列表行默認(rèn)包含修改及刪除功能的封裝方法
這篇文章主要介紹了Antd中Table列表行默認(rèn)包含修改及刪除功能的封裝,本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-12-12
這篇文章主要給大家介紹了關(guān)于微信小程序使用Vant Weapp組件庫的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08
本篇文章主要分享了js實現(xiàn)帶緩動動畫的導(dǎo)航欄效果的示例代碼。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01