本文實(shí)例講述了javascript設(shè)計(jì)模式 ? 工廠模式原理與應(yīng)用。分享給大家供大家參考，具體如下：

介紹：前面我們介紹了簡單工廠模式，簡單工廠模式存在一個(gè)嚴(yán)重的問題：當(dāng)需要擴(kuò)展時(shí)必定要修改工廠類的源代碼。我們雖然在第二個(gè)demo中做了一些優(yōu)化，但是我們需在使用時(shí)明確指定執(zhí)行方法的名字，這無疑提高了使用成本。那如何實(shí)現(xiàn)增加新產(chǎn)品而不影響已有代碼？工廠模式應(yīng)運(yùn)而生。

定義：定義一個(gè)用于創(chuàng)建對象的接口，讓子類決定將哪一個(gè)類實(shí)例化。工廠模式讓一個(gè)類的實(shí)例化延遲到其子類。工廠模式又稱為工廠方法模式，又可稱為虛擬構(gòu)造器模式或多態(tài)工廠模式。工廠模式是一種類創(chuàng)建型模式。

場景：還是基于簡單工廠模式的場景，我們試著用工廠模式解決彈窗類的問題。

示例：

var Dialog = function(){ this.show = function(){ console.log(this.name + ’ is show -> ’ + this.element); }}; Dialog.createNotice = function(){ var _dialog = new Dialog(); _dialog.element = ’<div>notice</div>’; _dialog.name = ’notice’; return _dialog;}; Dialog.createToast = function(){ var _dialog = new Dialog(); _dialog.element = ’<div>toast</div>’; _dialog.name = ’toast’; return _dialog;}; Dialog.createWarnin = function(){ var _dialog = new Dialog(); _dialog.element = ’<div>warnin</div>’; _dialog.name = ’warnin’; return _dialog;}; var Factory = {}; Factory.NoticeFactory = function(){ return Dialog.createNotice();} Factory.ToastFactory = function(){ return Dialog.createToast();} Factory.WarninFactory = function(){ return Dialog.createWarnin();} var notice = Factory.NoticeFactory();var toast = Factory.ToastFactory();var warnin = Factory.WarninFactory();notice.show(); //notice is show -> <div>notice</div>toast.show(); //toast is show -> <div>toast</div>warnin.show(); //warnin is show -> <div>warnin</div>

對比簡單工廠模式，工廠模式解決了什么問題呢？

最主要的就是將簡單工廠模式的factory方法進(jìn)行拆分

交由其子類也就是createToast方法實(shí)現(xiàn)

而將所有工廠入口拆成獨(dú)立工廠類，之前的簡單工廠模式在新增時(shí)需要修改工廠類，違反了開關(guān)原則

工廠模式保證新增時(shí)只做添加不做修改

項(xiàng)目足夠大時(shí)，你可以將Factory和Dialog的子類拆成文件進(jìn)行管理

在寫工廠模式的這段時(shí)間，查了一些資料，發(fā)現(xiàn)每個(gè)人都有自己的理解

看到的一些工廠模式的demo更像是我們前面介紹簡單工廠模式，為什么呢？

我們的demo參考的是java的書籍，這里面包含了抽象類這個(gè)概念，在前端只能靠自己的理解去描述

所以我們盡力通過一些差別來具體的介紹每一種模式

這里面的例子可能不是特別嚴(yán)謹(jǐn)，我后面會(huì)慢慢優(yōu)化，寫的詳細(xì)一些只有一個(gè)目的

當(dāng)有一天有人問我簡單工廠模式和工廠模式的區(qū)別在哪，我希望我能給出一個(gè)我的理解

工廠模式總結(jié)：

優(yōu)點(diǎn)：* 增加新產(chǎn)品時(shí)，無需修改已存在的代碼* 只暴露工廠類，對具體實(shí)現(xiàn)封裝在內(nèi)部，使用時(shí)無需關(guān)注內(nèi)部使用

缺點(diǎn)：* 新增時(shí)還是需要新增具體實(shí)現(xiàn)以及提供具體的工廠類，一定程度增加了系統(tǒng)復(fù)雜度，會(huì)帶來一些額外開銷* 每個(gè)工廠只生產(chǎn)一種產(chǎn)品，會(huì)導(dǎo)致存在大量的工廠類，大大增加了系統(tǒng)的維護(hù)成本和運(yùn)行開銷

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。