1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>javascript高级语法14-组合模式实现</title>
  6. </head>
  7. <body>
  8. <script>
  9. //接口
  10. var Interface = function(name,methods){
  11. if(arguments.length != 2){
  12. alert("interface must have two paramters...");
  13. }
  14. this.name = name;//这个是接口的名字
  15. this.methods = [];//定义个空数组来转载函数名
  16. for (var i = 0; i < methods.length; i++) {
  17. if(typeof methods[i] != "string"){
  18. alert("method name must is String ...")
  19. }else{
  20. this.methods.push(methods[i])
  21. }
  22. }
  23. }
  24. //定义接口的一个静态方法来实现接口与实现类的直接检验
  25. //静态方法不要写成Interface.prototype.* 因为这是写到接口原型连上的
  26. //我们要把静态的函数直接写到类层次上
  27. Interface.ensureImplements = function(object){
  28. if(arguments.length<2){
  29. alert("必须最少是2个参数");
  30. return false;
  31. }
  32. //遍历
  33. for (var i = 1; i < arguments.length; i++) {
  34. var inter = arguments[i];
  35. //如果你是接口就必须是Interface类型的
  36. if(inter.constructor != Interface){
  37. throw new Error("if is interface class must is Interface type");
  38. }
  39. //遍历函数集合并分析
  40. for (var j = 0; j < inter.methods.length; j++) {
  41. var method = inter.methods[j];
  42. //实现类中必须有方法名字 和 接口中所有的方法名项目
  43. if(!object[method] || typeof object[method] != "function"){
  44. throw new Error("实现类并没有完全实现接口中的所有方法...");
  45. }
  46. }
  47. }
  48. }
  49.  
  50. /*
  51. * 组合模式
  52. */
  53.  
  54. function demo(){
  55. var composite = new Interface("composite",["getChildByName","add"]);
  56. var student = new Interface("composite",["goToClass","finishClass"]);
  57. //定义组合类
  58. var compositeObj = function(name){
  59. this.name = name;
  60. this.type = "com"; //默认是组合类
  61. var childs = new Array();
  62. //得到相关的所有孩子节点
  63. this.getChildByName=function(name){
  64. //涉及到递归
  65. var toChilds = new Array();
  66. if(!name){
  67. for(var i=0;i<childs.length;i++){
  68. if(childs[i].type == "com"){ //组合节点
  69. toChilds = toChilds.concat(childs[i].getChildByName());
  70. }else{ //叶子节点
  71. toChilds.push(childs[i]);
  72.  
  73. }
  74. }
  75. }else{
  76. for(var i=0;i<childs.length;i++){
  77. if(childs[i].name == name){
  78. if(childs[i].type == "com"){
  79. toChilds = toChilds.concat(childs[i].getChildByName());
  80. break;
  81. }else{
  82. toChilds.push(childs[i]);
  83. break;
  84. }
  85. }else{
  86. if(childs[i].type == "com"){
  87. toChilds = toChilds.concat(childs[i].getChildByName(name));
  88. }
  89. }
  90. }
  91. }
  92. return toChilds;
  93. }
  94. //增加子节点
  95. this.add = function(child){
  96. childs.push(child);
  97. return this;
  98. }
  99. //上课
  100. this.goToClass = function(name){
  101. var toChilds = this.getChildByName(name);
  102. for(var i=0;i<toChilds.length;i++){
  103. toChilds[i].goToClass(); //子类的GoToClass方法
  104. }
  105. }
  106. //下课
  107. this.finishClass = function(name){
  108. var toChilds = this.getChildByName(name);
  109. for(var i=0;i<toChilds.length;i++){
  110. toChilds[i].finishClass(); //子类的GoToClass方法
  111. }
  112. }
  113. //接口验证
  114. Interface.ensureImplements(this,composite,student);
  115. }
  116. //定义叶子类
  117. var studentObj = function(name){
  118. this.name = name;
  119. this.type = "stu";//默认是叶子
  120.  
  121. //得到相关的所有孩子节点
  122. this.getChildByName=function(name){
  123. if(this.name == name){
  124. return this;
  125. }else{
  126. return null;
  127. }
  128. }
  129. //增加子节点
  130. this.add = function(child){
  131. throw new Error("add 不能被初始化在叶子类中!");
  132. }
  133. //上课
  134. this.goToClass = function(name){
  135. document.write(this.name + "去上课<br>")
  136. }
  137. //下课
  138. this.finishClass = function(name){
  139. document.write(this.name + " 下课<br>")
  140. }
  141. Interface.ensureImplements(this,composite,student);
  142. }
  143.  
  144. //测试;
  145. var a = new studentObj("a");
  146. var b = new studentObj("b");
  147. var c = new studentObj("c");
  148. var d = new studentObj("d");
  149. var e = new studentObj("e");
  150. var f = new studentObj("f");
  151. var g = new studentObj("g");
  152. var h = new studentObj("h");
  153. var one = new compositeObj("一班");
  154. var oneOne = new compositeObj("一班一组");
  155. oneOne.add(a).add(b);
  156. var oneTwo = new compositeObj("一班二组");
  157. oneTwo.add(c).add(d);
  158. one.add(oneOne).add(oneTwo);
  159. var two = new compositeObj("二班");
  160. var twoOne = new compositeObj("二班一组");
  161. twoOne.add(e).add(f);
  162. var twoTwo = new compositeObj("二班二组");
  163. twoTwo.add(g).add(h);
  164. two.add(twoOne).add(twoTwo);
  165. var xuexiao = new compositeObj("新学校");
  166. xuexiao.add(one).add(two);
  167.  
  168. //客户端调用API
  169. xuexiao.goToClass();
  170. document.write("------------------------<br>");
  171. xuexiao.goToClass("一班");
  172. document.write("------------------------<br>");
  173. xuexiao.goToClass("二班一组");
  174. document.write("------------------------<br>");
  175. xuexiao.goToClass("a");
  176.  
  177. }
  178. demo();
  179. </script>
  180. </body>
  181. </html>

JavaScript设计模式-14.组合模式实现的更多相关文章

  1. JavaScript设计模式之----组合模式

    javascript设计模式之组合模式 介绍 组合模式是一种专门为创建Web上的动态用户界面而量身制定的模式.使用这种模式可以用一条命令在多个对象上激发复杂的或递归的行为.这可以简化粘合性代码,使其更 ...

  2. 再起航,我的学习笔记之JavaScript设计模式15(组合模式)

    组合模式 组合模式(Composite): 又称部分-整体模式,将对象组合成树形结构以表示"部分整体"的层次结构.组合模式使得用户对单个对象和组合对象的使用具有一致性. 如果有一个 ...

  3. JavaScript设计模式(5)-组合模式

    组合模式 1. 适合使用组合模式的条件: 存在一批组织成某种层次体系的对象,如树形结构(具体的结构在开发期间可能无法得知) 希望对这批对象或其中的一部分对象实施一个相同的操作 2. 注意点: 组合对象 ...

  4. 再起航,我的学习笔记之JavaScript设计模式14(桥接模式)

    桥接模式 桥接模式(Bridge): 在系统沿着多个维度变化的同时,又不增加其复杂度并已达到解耦 从定义上看桥接模式的定义十分难以理解,那么我们来通过示例来演示什么是桥接模式. 现在我们需要做一个导航 ...

  5. JavaScript设计模式-13.组合模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 从ES6重新认识JavaScript设计模式(三): 建造者模式

    1 什么是建造者模式? 建造者模式(Builder)是将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示. 建造者模式的特点是分步构建一个复杂的对象,可以用不同组合或顺序建造出不 ...

  7. C#设计模式(10)——组合模式(Composite Pattern)

    一.引言 在软件开发过程中,我们经常会遇到处理简单对象和复合对象的情况,例如对操作系统中目录的处理就是这样的一个例子,因为目录可以包括单独的文件,也可以包括文件夹,文件夹又是由文件组成的,由于简单对象 ...

  8. c++设计模式15 --组合模式

    今天研究了一下设计模式15 组合模式 本人是菜鸟一枚,所以一开始完全不懂组合究竟是什么意思.先上图一张,树形结构图: 文档说,如果想做出这样的结构,通常考虑组合模式.那是为什么呢?现在让我们看一下组合 ...

  9. 乐在其中设计模式(C#) - 组合模式(Composite Pattern)

    原文:乐在其中设计模式(C#) - 组合模式(Composite Pattern) [索引页][源码下载] 乐在其中设计模式(C#) - 组合模式(Composite Pattern) 作者:weba ...

随机推荐

  1. Scala程序编译运行

    1.编译 Scala演示代码如下: <pre name="code" class="plain">/** * @author Administrat ...

  2. 还原bak到localdb的问题:The logical database file cannot be found ldf

    主要环境相关因素:win7,ms sql 2012,ms localdb,msms 2012. 步骤: 1,让DBA给一个bak文件到本地来做测试,DBA按自己的工作流程得到bak文件. 2,在msm ...

  3. 介绍 ASP.NET Identity - ASP.NET 应用程序的成员身份认证系统

    ASP.NET Identity 是构建 ASP.NET web 应用程序的一种新的身份认证系统.ASP.NET Identity 可以让您的应用程序拥有登录功能,并可以轻松地自定义登录用户的相关数据 ...

  4. Xshell传输文件

    用rz,sz命令在xshell传输文件 很好用,然后有时候想在windows和linux上传或下载某个文件,其实有个很简单的方法就是rz,sz 首先你的Ubuntu需要安装rz.sz(如果没有安装请执 ...

  5. Eavl() 数据绑定格式化时间

    <%#Eval("字段名","{0:yyyy-MM-dd}") %> 或者 <%#((DateTime)Eval("news_tim ...

  6. swagger简单配置

    第一步: 在nuget.org中查找Swashbuckle并下载 在nuget.org中查找Swagger.net.UI,并下载 第二步: 下载完之后,App_Start多了三个文件 Swagger. ...

  7. Sql语法高级应用之六:如何在Sql语句中如何使用TRY...CATCH

    TRY...CATCH使用范例 BEGIN TRY //逻辑语句块 END TRYBEGIN CATCH //Catch异常处理块 SET @msg = ERROR_MESSAGE(); PRINT ...

  8. columns数组形式展示不同列数据

    function workList() { var status = $("#status1").val(); if (null == status || status == &q ...

  9. ASP.NET WebApi总结之自定义权限验证

    在.NET中有两个AuthorizeAttribute类, 一个定义在System.Web.Http命名空间下 #region 程序集 System.Web.Http, Version=5.2.3.0 ...

  10. C#上传文件处理

    public class FileHelp : System.Web.UI.Page { /// <summary> /// 保存文件 /// 返回:数组:status[0]:文件名称:s ...