组合模式就是用小的子对象来构建更大的对象，而这些小的子对象本身也许是由更小的“孙对象”构成的。
一、组合模式的用途
组合模式将对象组合成树形结构，以表示“部分.整体”的层次结构。 除了用来表示树形结构之外，组合模式的另一个好处是通过对象的多态性表现，使得用户对单个对象和组合对象的使用具有一致性，具体如下：
- 表示树形结构。通过回顾上面的例子，我们很容易找到组合模式的一个优点：提供了一种遍历树形结构的方案，通过调用组合对象的execute 方法，程序会递归调用组合对象下面的叶对象的execute 方法，组合模式可以非常方便地描述对象部分-整体层次结构。
- 利用对象多态性统一对待组合对象和单个对象。利用对象的多态性表现，可以使客户端忽略组合对象和单个对象的不同。在组合模式中，客户将统一地使用组合结构中的所有对象，而不需要关心它究竟是组合对象还是单个对象。
这在实际开发中会给客户带来相当大的便利性，当我们往万能遥控器里面添加一个命令的时候，并不关心这个命令是宏命令还是普通子命令。这点对于我们不重要，我们只需要确定它是一个命令，并且这个命令拥有可执行的execute 方法，那么这个命令就可以被添加进万能遥控器。
当宏命令和普通子命令接收到执行execute 方法的请求时，宏命令和普通子命令都会做它们各自认为正确的事情。这些差异是隐藏在客户背后的，在客户看来，这种透明性可以让我们非常自由地扩展这个万能遥控器。
二、请求在树中传递的过程
以宏命令为例，请求从树最顶端的对象往下传递，如果当前处理请求的对象是叶对象（普通子命令），叶对象自身会对请求作出相应的处理；如果当前处理请求的对象是组合对象（宏命令），组合对象则会遍历它属下的子节点，将请求继续传递给这些子节点。叶对象下面不会再有其他子节点，一个叶对象就是树的这条枝叶的尽头，组合对象下面可能还会有子节点。
三、更强大的宏命令
现在我们需要一个“超级万能遥控器”，可以控制家里所有的电器，这个遥控器拥有以下功能：
- 打开空调
- 打开电视和音响
- 关门、开电脑、登录QQ
首先在节点中放置一个按钮button 来表示这个超级万能遥控器，超级万能遥控器上安装了一个宏命令，当执行这个宏命令时，会依次遍历执行它所包含的子命令
<html> <head> <meta charset="utf-8"> </head> <body> <button id="button">按我</button> </body> <script> var MacroCommand = function(){ return { commandsList: [], add: function( command ){ this.commandsList.push( command ); }, execute: function(){ for ( var i = 0, command; command = this.commandsList[ i++ ]; ){ command.execute(); } } } }; var openAcCommand = { execute: function(){ console.log( '打开空调' ); } }; /**********家里的电视和音响是连接在一起的，所以可以用一个宏命令来组合打开电视和打开音响的命令*********/ var openTvCommand = { execute: function(){ console.log( '打开电视' ); } }; var openSoundCommand = { execute: function(){ console.log( '打开音响' ); } }; var macroCommand1 = MacroCommand(); macroCommand1.add( openTvCommand ); macroCommand1.add( openSoundCommand ); /*********关门、打开电脑和打登录QQ 的命令****************/ var closeDoorCommand = { execute: function(){ console.log( '关门' ); } }; var openPcCommand = { execute: function(){ console.log( '开电脑' ); } }; var openQQCommand = { execute: function(){ console.log( '登录QQ' ); } }; var macroCommand2 = MacroCommand(); macroCommand2.add( closeDoorCommand ); macroCommand2.add( openPcCommand ); macroCommand2.add( openQQCommand ); /*********现在把所有的命令组合成一个“超级命令”**********/ var macroCommand = MacroCommand(); macroCommand.add( openAcCommand ); macroCommand.add( macroCommand1 ); macroCommand.add( macroCommand2 ); /*********最后给遥控器绑定“超级命令”**********/ var setCommand = (function( command ){ document.getElementById( 'button' ).onclick = function(){ command.execute(); } })( macroCommand ); </script> </html>
只需要调用最上层对象的execute 方法。每当对最上层的对象进行一次请求时，实际上是在对整个树进行深度优先的搜索，而创建组合对象的程序员并不关心这些内在的细节，往这棵树里面添加一些新的节点对象是非常容易的事情。
四、透明性带来的安全问题
组合模式的透明性使得发起请求的客户不用去顾忌树中组合对象和叶对象的区别，但它们在本质上有是区别的。
组合对象可以拥有子节点，叶对象下面就没有子节点， 所以我们也许会发生一些误操作，比如试图往叶对象中添加子节点。解决方案通常是给叶对象也增加add 方法，并且在调用这个方法时，抛出一个异常来及时提醒客户。
var MacroCommand = function(){ return { commandsList: [], add: function( command ){ this.commandsList.push( command ); }, execute: function(){ for ( var i = 0, command; command = this.commandsList[ i++ ]; ){ command.execute(); } } } }; var openTvCommand = { execute: function(){ console.log( '打开电视' ); }, add: function(){ throw new Error( '叶对象不能添加子节点' ); } }; var macroCommand = MacroCommand(); macroCommand.add( openTvCommand ); openTvCommand.add( macroCommand ) // Uncaught Error: 叶对象不能添加子节点
五、组合模式的例子——扫描文件夹
/******************************* Folder ******************************/ var Folder = function( name ){ this.name = name; this.files = []; }; Folder.prototype.add = function( file ){ this.files.push( file ); }; Folder.prototype.scan = function(){ console.log( '开始扫描文件夹: ' + this.name ); for ( var i = 0, file, files = this.files; file = files[ i++ ]; ){ file.scan(); } }; /******************************* File ******************************/ var File = function( name ){ this.name = name; }; File.prototype.add = function(){ throw new Error( '文件下面不能再添加文件' ); }; File.prototype.scan = function(){ console.log( '开始扫描文件: ' + this.name ); }; //创建一些文件夹和文件对象， 并且让它们组合成一棵树，这棵树就是我们F 盘里的现有文件目录结构 var folder = new Folder( '学习资料' ); var folder1 = new Folder( 'JavaScript' ); var folder2 = new Folder ( 'jQuery' ); var file1 = new File( 'JavaScript 设计模式与开发实践' ); var file2 = new File( '精通jQuery' ); var file3 = new File( '重构与模式' ) folder1.add( file1 ); folder2.add( file2 ); folder.add( folder1 ); folder.add( folder2 ); folder.add( file3 ); //把移动硬盘里的文件和文件夹都复制到这棵树中，假设我们已经得到了这些文件对象： var folder3 = new Folder( 'Nodejs' ); var file4 = new File( '深入浅出Node.js' ); folder3.add( file4 ); var file5 = new File( 'JavaScript 语言精髓与编程实践' ); //把这些文件都添加到原有的树 folder.add( folder3 ); folder.add( file5 ); //运用了组合模式之后，扫描整个文件夹的操作也是轻而易举的，我们只需要操作树的最顶端对象 folder.scan();
六、些值得注意的地方
在使用组合模式的时候，还有以下几个值得我们注意的地方。
1. 组合模式不是父子关系
组合模式的树型结构容易让人误以为组合对象和叶对象是父子关系，这是不正确的。组合模式是一种HAS-A（聚合）的关系，而不是IS-A。组合对象包含一组叶对象，但Leaf并不是Composite 的子类。组合对象把请求委托给它所包含的所有叶对象，它们能够合作的关键是拥有相同的接口。
2. 对叶对象操作的一致性
组合模式除了要求组合对象和叶对象拥有相同的接口之外，还有一个必要条件，就是对一组叶对象的操作必须具有一致性。
只有用一致的方式对待列表中的每个叶对象的时候，才适合使用组合模式。
3. 双向映射关系
发放过节费的通知步骤是从公司到各个部门，再到各个小组，最后到每个员工的邮箱里。这本身是一个组合模式的好例子，但要考虑的一种情况是，也许某些员工属于多个组织架构。比如某位架构师既隶属于开发组，又隶属于架构组，对象之间的关系并不是严格意义上的层次结构，在这种情况下，是不适合使用组合模式的，该架构师很可能会收到两份过节费。
这种复合情况下我们必须给父节点和子节点建立双向映射关系，一个简单的方法是给小组和员工对象都增加集合来保存对方的引用。但是这种相互间的引用相当复杂，而且对象之间产生了过多的耦合性，修改或者删除一个对象都变得困难，此时我们可以引入中介者模式来管理这些对象。
4. 用职责链模式提高组合模式性能
在组合模式中，如果树的结构比较复杂，节点数量很多，在遍历树的过程中，性能方面也许表现得不够理想。有时候我们确实可以借助一些技巧，在实际操作中避免遍历整棵树，有一种现成的方案是借助职责链模式。职责链模式一般需要我们手动去设置链条，但在组合模式中，父对象和子对象之间实际上形成了天然的职责链。让请求顺着链条从父对象往子对象传递，或者是反过来从子对象往父对象传递，直到遇到可以处理该请求的对象为止，这也是职责链模式的经典运用场景之一。
七、引用父对象
组合对象保存了它下面的子节点的引用，这是组合模式的特点，此时树结构是从上至下的。当我们删除某个文件的时候，实际上是从这个文件所在的上层文件夹中删除该文件的。
var Folder = function( name ){ this.name = name; this.files = []; this.parent = null; //增加this.parent 属性 }; Folder.prototype.add = function( file ){ this.files.push( file ); file.parent = this; //设置父对象 }; Folder.prototype.scan = function(){ console.log( '开始扫描文件夹: ' + this.name ); for ( var i = 0, file, files = this.files; file = files[ i++ ]; ){ file.scan(); } }; Folder.prototype.remove = function(){ if ( !this.parent ){ //根节点或者树外的游离节点 return; } for ( var files = this.parent.files, l = files.length - 1; l >=0; l-- ){ var file = files[ l ]; if ( file === this ){ files.splice( l, 1 ); } } }; var File = function( name ){ this.name = name; this.parent = null; }; File.prototype.add = function(){ throw new Error( '不能添加在文件下面' ); }; File.prototype.scan = function(){ console.log( '开始扫描文件: ' + this.name ); }; File.prototype.remove = function(){ if ( !this.parent ){ //根节点或者树外的游离节点 return; } for ( var files = this.parent.files, l = files.length - 1; l >=0; l-- ){ var file = files[ l ]; if ( file === this ){ files.splice( l, 1 ); } } }; var folder = new Folder( '学习资料' ); var folder1 = new Folder( 'JavaScript' ); var file1 = new Folder ( '深入浅出Node.js' ); folder1.add( new File( 'JavaScript 设计模式与开发实践' ) ); folder.add( folder1 ); folder.add( file1 ); folder1.remove(); //移除文件夹 folder.scan();
八、何时使用组合模式
组合模式如果运用得当，可以大大简化客户的代码。一般来说，组合模式适用于以下这两种情况。
- 表示对象的部分.整体层次结构。组合模式可以方便地构造一棵树来表示对象的部分.整体结构。特别是我们在开发期间不确定这棵树到底存在多少层次的时候。在树的构造最终完成之后，只需要通过请求树的最顶层对象，便能对整棵树做统一的操作。在组合模式中增加和删除树的节点非常方便，并且符合开放.封闭原则。
- 客户希望统一对待树中的所有对象。组合模式使客户可以忽略组合对象和叶对象的区别，客户在面对这棵树的时候，不用关心当前正在处理的对象是组合对象还是叶对象，也就不用写一堆if、else 语句来分别处理它们。组合对象和叶对象会各自做自己正确的事情，这是组合模式最重要的能力。
然而，组合模式并不是完美的，它可能会产生一个这样的系统：系统中的每个对象看起来都与其他对象差不多。它们的区别只有在运行的时候会才会显现出来，这会使代码难以理解。此外，如果通过组合模式创建了太多的对象，那么这些对象可能会让系统负担不起。