《javascript设计模式与开发实践》阅读笔记（10）—— 组合模式

组合模式：一些子对象组成一个父对象，子对象本身也可能是由一些孙对象组成。

 

有点类似树形结构的意思，这里举一个包含命令模式的例子

 1 var list=function(){   //创建接口对象的函数 2     return { 3         arr:[],     //执行列表  用来存储需要执行的对象 4         add:function(obj){       //往执行列表里添加对象 5             this.arr.push(obj);    6         }, 7         execute:function(){    //遍历执行列表，每个对象执行规定好的接口方法 8             for(var i=0,l=this.arr.length;i<l;i++){ 9                 this.arr[i].execute();10             }11         }12     }13 };14 15 var menubar={                          //一系列对象，每个对象都有一个相同的接口，便于同时调用16     execute:function(){17         console.log("刷新menubar")18     }19 }20 21 var headbar={22     execute:function(){23         console.log("刷新headbar")24     }25 }26 27 var footbar={28     execute:function(){29         console.log("刷新footbar")30     }31 }32 33 var move={34     execute:function(){35         console.log("加入动画")36     }37 }38 39 var picA={40     execute:function(){41         console.log("移除picA")42     }43 }44 45 var picB={46     execute:function(){47         console.log("移除picB")48     }49 }50 51 52 var refresh=list();   //负责刷新的接口对象53 refresh.add( menubar );  //添加需要刷新的对象54 refresh.add( headbar );55 refresh.add( footbar );56 57 58 var remove=list();   //负责移除的接口对象59 remove.add( picA );  //需要移除的对象60 remove.add( picB );61 62 var start=list();  //负责所有事情的接口对象63 start.add( refresh );   //添加负责刷新的组合对象64 start.add( move );     //添加负责动画的对象65 start.add( remove );     //添加负责移除的组合对象66 67 start.execute();  //执行这个组合对象68 69 /****执行结果****70 71   刷新menubar72   刷新headbar73   刷新footbar74   加入动画75   移除picA76   移除picB77 */

 

感觉上有点像俄罗斯套娃，首先定义了一个接口对象，大家都是这个接口对象，只不过一层套一层，不断调用。

执行过程其实就是深度优先搜索。

 

一些值得注意的地方

 

组合模式不是父子关系，而是更类似于一种委托关系。
适用场景：只有用一致的方式对待列表中的每个叶对象的时候，才适合使用组合模式。

 

总结

组合模式可以让我们使用树形方式创建对象的结构，我们可以把相同的操作应用在组合对象和单个对象上。