首頁 > web前端 > js教程 > JS設計模式之建造者模式詳解

JS設計模式之建造者模式詳解

php中世界最好的语言
發布: 2018-03-14 14:09:45
原創
1960 人瀏覽過

這次帶給大家JS設計模式建造者模式詳解,使用JS建造者模式的注意事項有哪些,以下就是實戰案例,一起來看一下。

概念 
建造者模式可以將一個複雜的物件的建構與其表示相分離,使同樣的建構過程可以創造不同的表示。如果我們使用了建造者模式,那麼使用者就需要指定需要建造的類型就可以得到它們,而具體建造的過程和細節就不需要知道了。建造者模式實際上是一個指揮者,一個建造者,一個使用指揮者調用具體建造者工作得出結果的客戶。主要用於「分步驟建構一個複雜的物件」

作用以及注意事項

模式作用:

逐步建立一個複雜的物件

#解耦封裝過程和具體創建組件

無需關心組件如何組裝

注意事項:

一定要一個穩定的演算法來支援(「分步驟」是一個穩定的演算法)

加工製程是暴露的 

了解了基本原理之後,我們來看下面這個實例,然後你就會對建造這模式有更深的認識了。

實例

一個土豪需要建造一棟別墅,然後直接找包工頭,包工頭再找工人把別墅建好。這裡土豪不用直接一個一個工人的去找。只要包工頭知道土豪需求,然後去找工人,工人工作,土豪也不需要知道房子具體怎麼建,最後能拿到房就可以了。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

//1.产出东西是房子

         //2.包工头调用工人进行开工而且他要很清楚工人们具体的某一个大项

         //3.工人是盖房子的 工人可以建厨房、卧室、建客厅

         //4.包工头只是一个接口而已 他不干活 他只对外说我能建房子

         function House() {

             this.kitchen = ""; this.bedroom = ""; this.livingroom = "";

         };

         function Contractor() {

             this.construct = function(worker) {

                 worker.construct_kitchen(); worker.construct_bedroom(); worker.construct_livingroom();

             }

         };

         function Worker() {

             this.construct_kitchen =function() {

                 console.log("厨房建好了");

             }

             this.construct_bedroom = function() {

                 console.log("卧室建好了");

             }

             this.construct_livingroom = function() {

                 console.log("客厅建好了");

             }                this.submit = function() {

                 var _house = new House();

                 _house.kitchen = "finished";

                 _house.bedroom = "finished";

                 _house.livingroom = "finished";

                 return _house;

             }

         };

         var worker = new Worker();

         var contractor = new Contractor();

         contractor.construct(worker);

         // 主人要房子 var myhouse = worker.submit(); console.log(myhouse);

登入後複製

我相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

推薦閱讀:

JS的設計模式之建構子模式詳解

js設計模式之-單例模式的使用

以上是JS設計模式之建造者模式詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板