>[success] # java 角度看組合模式 ~~~ 1.組合模式可以想成一棵樹，樹的組成就是'枝'和'葉','java'又不像'js'動態自帶多態效果， 讓我們在寫的時候不在意到底是'枝'還是'葉' 2.在'java'想實現多態的一種途徑就是想上轉型，因此只需要讓'樹'和'葉' 繼承同一個類即可， 但是這個類具體要有怎么樣的實現暫時未知就可以用'抽象類來編寫' 3. 因此可以拆分三個部分： 3.1.'Component（抽象構件）'：它可以是接口或抽象類，為葉子構件和容器構件對象聲明接口， 在該角色中可以包含所有子類共有行為的聲明和實現。在抽象構件中定義了訪問及管理它的子 構件的方法，如增加子構件、刪除子構件、獲取子構件等。 3.2.'Leaf（葉子構件）'：它在組合結構中表示葉子節點對象，葉子節點沒有子節點，它實現了在抽象 構件中定義的行為。對于那些訪問及管理子構件的方法，可以通過異常等方式進行處理。 3.3.'Composite（容器構件）'：它在組合結構中表示容器節點對象，容器節點包含子節點，其子節點 可以是葉子節點，也可以是容器節點，它提供一個集合用于存儲子節點，實現了在抽象構件中定 義的行為，包括那些訪問及管理子構件的方法，在其業務方法中可以遞歸調用其子節點的業務方法。 ~~~ >[danger] ##### JavaScript設計模式與開發實踐 給出的案例代碼 ~~~ 1.書中給的這個案例不太好，大概可以看出整個案例思路，如果是葉子節點當你調用 添加方法的時候會拋出異常告訴你不可以添加 ~~~ ~~~ public abstract class Component{ //add 方法，參數為 Component 類型 public void add( Component child ){} //remove 方法，參數為 Component 類型 public void remove( Component child ){} } public class Composite extends Component{ //add 方法，參數為 Component 類型 public void add( Component child ){} //remove 方法，參數為 Component 類型 public void remove( Component child ){} } public class Leaf extends Component{ //add 方法，參數為 Component 類型 public void add( Component child ){ throw new UnsupportedOperationException() // 葉對象不能再添加子節點 } //remove 方法，參數為 Component 類型 public void remove( Component child ){} } public class client(){ public static void main( String args[] ){ Component root = new Composite(); Component c1 = new Composite(); Component c2 = new Composite(); Component leaf1 = new Leaf(); Component leaf2 = new Leaf(); root.add(c1); root.add(c2); c1.add(leaf1); c1.add(leaf2); root.remove(); } } ~~~ >[danger] ##### 更好的案例 和寫法的文章地址 [簡潔版本](http://blueskykong.com/2017/01/20/design-Composite/) [復雜深入版本](https://juejin.im/post/5bb730e96fb9a05d0c37e66b#heading-2) [案例一](https://juejin.im/post/587f841661ff4b00651ee174) [案例二](https://juejin.im/post/59e653c46fb9a0452935d715#heading-1) >[success] # 讓js 的葉子節點也不能在隨意添加 ~~~ 1.組合模式的透明性使得發起請求的客戶不用去顧忌樹中組合對象和葉對象的區別，但它們在 本質上有是區別的。 組合對象可以擁有子節點，葉對象下面就沒有子節點， 所以我們也許會發生 一些誤操作， 比如試圖往葉對象中添加子節點。 2.可以向java一樣在葉子節點上增加異常拋出 ~~~ ~~~ 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: 葉對象不能添加子節點 ~~~