JavaScript 设计模式之建造者模式

时间:2023-03-08 20:39:40

一、建造者模式概念解读

1.建造者模式概念文字解读

建造者模式可以将一个复杂对象的构建与其表示分离,使得同样的构建过程可以创建不同的表示。也就是说如果我们用了建造者模式,那么用户就需要指定需要建造的类型就可以得到它们,而具体建造的过程和细节就不需要知道了。建造者模式实际,就是一个指挥者,一个建造者,一个使用者调用具体建造者工作得出结果的客户。

建造者模式主要用于“分步骤构建一个复杂的对象”,这在其中“分步骤”是一个稳定的算法,而复杂对象的各个部分则经常变化。一句话:指挥者分配任务,建造者进行开发,各执其责,稳定在一个大的流程里面去。

2.建造者模式概念拟物化解读

一位女士要建造一座别墅,需要找来一位包工头,包工头再将具体的任务分配给工人做,做完之后再给女士使用。JavaScript 设计模式之建造者模式

二、建造者模式的作用和注意事项

模式作用:

1.分步骤创建一个复杂的对象(先各自独立的细节)。

2.解耦封装过程和具体创建的组件。

3.无需关心组件如何组装。

注意事项:

1.一定要有一个稳定的算法进行支持(要先把合同签好)。

2.加工工艺是暴露的(使用者可以反馈问题,中间需要介入一个包工头)。

八字:各执其职,拆解流程。

三、建造者模式的代码实战和总结

1.一个实例

代码如下:

<meta charset="utf-8"/>
<script type="text/javascript">
//1.产出的东西是房子house
//2.包工头contractor 调用工人进行开工 而且他要很清楚工人们具体的某一个大项
//3.工人worker 是盖房子的 工人可以建卧室make_bedroom、建客厅make_livingroom、建厨房make_kitchen
//4.包工头只是一个接口而已,他不干活,他只对外说我能盖房子 //房子House
function House(){ //作为类,首字母大写
this.bedroom="";
this.livingroom="";
this.kitchen="";
}
//包工头Contractor
function Contracter(){
this.makeHouse=function(worker){
worker.make_bedroom();
worker.make_livingroom();
worker.make_kitchen();
}
}
//工人Worker
function Worker(){
this.make_bedroom=function(){
alert('卧室我盖好了'); //因为alert 的是中文,所以在最前面要一个utf-8
}
this.make_livingroom=function(){
alert('客厅我盖好了');
}
this.make_kitchen=function(){
alert('厨房我盖好了');
}
//交工handover
this.handover=function(){
var _house= new House();
_house.bedroom="ok";
_house.livingroom="ok";
_house.kitchen="ok";
return _house; }
};
var worker=new Worker;
var contracter=new Contracter();
contracter.makeHouse(worker);//包工头声称他能盖房子,是一个接口,故要给他一个makeHouse(worker)
var myhouse=worker.handover();
console.log(myhouse); //整个过程女主人不用和工人直接接触,只需要交代给包工头就可以了 </script>

结果截图:

JavaScript 设计模式之建造者模式

JavaScript 设计模式之建造者模式

JavaScript 设计模式之建造者模式

JavaScript 设计模式之建造者模式