快捷導(dǎo)航

JavaScript設(shè)計(jì)模式之工廠模式簡(jiǎn)單實(shí)例教程

更新時(shí)間：2018年07月03日 08:43:58 作者：CangoWu

這篇文章主要介紹了JavaScript設(shè)計(jì)模式之工廠模式,結(jié)合完整實(shí)例形式分析了工廠模式的概念、原理及javascript定義與使用工廠模式的相關(guān)操作技巧,需要的朋友可以參考下

一、工廠模式概念

工廠模式定義一個(gè)用于創(chuàng)建對(duì)象的接口，這個(gè)接口由子類(lèi)決定實(shí)例化哪一個(gè)類(lèi)。該模式使一個(gè)類(lèi)的實(shí)例化延遲到了子類(lèi)。而子類(lèi)可以重寫(xiě)接口方法以便創(chuàng)建的時(shí)候指定自己的對(duì)象類(lèi)型（抽象工廠）。

這個(gè)模式十分有用，尤其是創(chuàng)建對(duì)象的流程賦值的時(shí)候，比如依賴于很多設(shè)置文件等。并且，你會(huì)經(jīng)常在程序里看到工廠方法，用于讓子類(lèi)定義需要?jiǎng)?chuàng)建的對(duì)象類(lèi)型。

二、工廠模式的作用和注意事項(xiàng)

模式作用：

1、對(duì)象構(gòu)建十分復(fù)雜--我們穿鞋很簡(jiǎn)單，但是制作鞋子的過(guò)程十分復(fù)雜

2、需要依賴具體的環(huán)境創(chuàng)建不同的實(shí)例--工廠可以做鞋子，做衣服，工廠可以做我需要的鞋子（鞋子不同），然后送到指定的地方（地方可以不同），可以理解為不同的實(shí)例

3、處理大量具有相同屬性的小對(duì)象--比如買(mǎi)一雙鞋，沒(méi)必要找工廠生產(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)該有廠長(zhǎng)來(lái)決定運(yùn)行到底哪條產(chǎn)品線
 //2.消費(fèi)者-》子類(lè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測(cè)試運(yùn)行效果如下：