JavaScript設(shè)計(jì)模式之工廠模式簡單實(shí)例教程
本文實(shí)例講述了JavaScript設(shè)計(jì)模式之工廠模式。分享給大家供大家參考,具體如下:
一、工廠模式概念
工廠模式定義一個(gè)用于創(chuàng)建對象的接口,這個(gè)接口由子類決定實(shí)例化哪一個(gè)類。該模式使一個(gè)類的實(shí)例化延遲到了子類。而子類可以重寫接口方法以便創(chuàng)建的時(shí)候指定自己的對象類型(抽象工廠)。
這個(gè)模式十分有用,尤其是創(chuàng)建對象的流程賦值的時(shí)候,比如依賴于很多設(shè)置文件等。并且,你會經(jīng)常在程序里看到工廠方法,用于讓子類定義需要?jiǎng)?chuàng)建的對象類型。
二、工廠模式的作用和注意事項(xiàng)
模式作用:
1、對象構(gòu)建十分復(fù)雜--我們穿鞋很簡單,但是制作鞋子的過程十分復(fù)雜
2、需要依賴具體的環(huán)境創(chuàng)建不同的實(shí)例--工廠可以做鞋子,做衣服,工廠可以做我需要的鞋子(鞋子不同),然后送到指定的地方(地方可以不同),可以理解為不同的實(shí)例
3、處理大量具有相同屬性的小對象--比如買一雙鞋,沒必要找工廠生產(chǎn)
注意事項(xiàng):
1、不能濫用工廠,有時(shí)候僅僅是給代碼增加復(fù)雜度--如上3
三、工廠模式代碼和實(shí)戰(zhàn)總結(jié)
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>工廠模式</title>
</head>
<body>
<script>
//1.工廠應(yīng)該有廠長來決定運(yùn)行到底哪條產(chǎn)品線
//2.消費(fèi)者-》子類
var gongchang = {};
gongchang.chanyifu = function(){
this.gongren = 50;
console.log("我們有"+this.gongren);
}
gongchang.chanxie = function(){
this.gongren = 100;
console.log("產(chǎn)鞋子");
}
gongchang.yunshu = function(){
this.gongren = 10;
console.log("運(yùn)輸");
}
gongchang.changzhang = function(para){
return new gongchang[para]();
}
var we = gongchang.changzhang("chanyifu");
var me = gongchang.changzhang("chanxie");
console.log(me.gongren);
var ys = gongchang.changzhang("yunshu");
console.log(ys.gongren);
</script>
</body>
</html>
使用在線HTML/CSS/JavaScript代碼運(yùn)行工具 http://tools.jb51.net/code/HtmlJsRun測試運(yùn)行效果如下:

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題:《javascript面向?qū)ο笕腴T教程》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計(jì)有所幫助。
- 深入理解JavaScript系列(38):設(shè)計(jì)模式之職責(zé)鏈模式詳解
- JavaScript實(shí)現(xiàn)職責(zé)鏈模式概述
- JavaScript職責(zé)鏈模式概述
- JavaScript設(shè)計(jì)模式之模板方法模式原理與用法示例
- JavaScript設(shè)計(jì)模式之緩存代理模式原理與簡單用法示例
- JavaScript設(shè)計(jì)模式之觀察者模式(發(fā)布訂閱模式)原理與實(shí)現(xiàn)方法示例
- JavaScript設(shè)計(jì)模式之工廠模式和抽象工廠模式定義與用法分析
- JavaScript設(shè)計(jì)模式之構(gòu)造器模式(生成器模式)定義與用法實(shí)例分析
- JavaScript設(shè)計(jì)模式之單例模式原理與用法實(shí)例分析
- JavaScript設(shè)計(jì)模式之裝飾者模式定義與應(yīng)用示例
- JavaScript設(shè)計(jì)模式之職責(zé)鏈模式應(yīng)用示例
相關(guān)文章
JavaScript實(shí)現(xiàn)網(wǎng)頁圖片等比例縮放實(shí)現(xiàn)代碼及調(diào)用方式
為了保證圖片統(tǒng)一大小,直接設(shè)置圖片大小又會導(dǎo)致圖片拉伸,造成圖片模糊,接下來將介紹的代碼可以在圖片加載完成后自動按比例調(diào)整圖片大小,感興趣的你可以參考下2013-02-02
詳解js中構(gòu)造流程圖的核心技術(shù)JsPlumb
這篇文章主要介紹了js中構(gòu)造流程圖的核心技術(shù)JsPlumb,jsPlumb是一個(gè)強(qiáng)大的JavaScript連線庫,它可以將html中的元素用箭頭、曲線、直線等連接起來,適用于開發(fā)Web上的圖表、建模工具等,需要的朋友可以參考下2015-12-12
IE,firefox(火狐)瀏覽器無提示關(guān)閉窗口js實(shí)現(xiàn)代碼小結(jié)
在不是js打開的頁面上按window.close(),會有提示框,很煩,現(xiàn)在可以不用了,沒有提示框直接關(guān)閉窗口。下面腳本之家編輯特為大家整理了一些。2009-09-09
javascript之with的使用(阿里云、淘寶使用代碼分析)
這篇文章主要介紹了javascript之with的使用(阿里云、淘寶使用代碼分析),主要是發(fā)現(xiàn)了阿里云使用了這段比較有B格的代碼,所以說下這個(gè)怎么樣2016-10-10
從歷史講起JavaScript基因里的函數(shù)式編程實(shí)例
這篇文章主要為大家介紹了從歷史講起JavaScript基因里的函數(shù)式編程實(shí)例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-10-10
JavaScript Rxjs mergeMap 的使用場合
這篇文章主要介紹了JavaScript Rxjs mergeMap 的使用場合,mergeMap 接收一個(gè)函數(shù)作為輸入?yún)?shù),這個(gè)函數(shù)的輸入?yún)?shù)就是通過 pipe 鏈接 mergeMap 的 Observable 里包含的元素2022-07-07
JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名器實(shí)例詳解
這篇文章主要介紹了JavaScript隨機(jī)點(diǎn)名器,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05

