欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript組合設(shè)計(jì)模式--改進(jìn)引入案例分析

 更新時(shí)間:2020年05月23日 09:48:39   作者:WFaceBoss  
這篇文章主要介紹了JavaScript組合設(shè)模式改進(jìn)引入案例,結(jié)合實(shí)例形式分析了JavaScript組合設(shè)計(jì)模式特性改進(jìn)的引入示例相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了JavaScript組合設(shè)計(jì)模式--改進(jìn)引入案例。分享給大家供大家參考,具體如下:

對(duì)于組合設(shè)計(jì)模式:

 (1)組合模式中把對(duì)象分為兩種(組合對(duì)象,和葉子對(duì)象)
 (2)組合對(duì)象和葉子對(duì)象實(shí)現(xiàn):同一批操作
 (3)對(duì)組合對(duì)象執(zhí)行的操作可以向下傳遞到葉子節(jié)點(diǎn)進(jìn)行操作
 (4)這樣就會(huì)弱化類與類之間的耦合
 (5)他常用的手法是把對(duì)象組合成屬性結(jié)構(gòu)的對(duì)象

根據(jù)組合模式的這些特性我們改寫(xiě)代碼如下:

由于用到了接口檢驗(yàn)所以我們先引入接口文件代碼

//定義一個(gè)靜態(tài)方法來(lái)實(shí)現(xiàn)接口與實(shí)現(xiàn)類的直接檢驗(yàn)
//靜態(tài)方法不要寫(xiě)出Interface.prototype ,因?yàn)檫@是寫(xiě)到接口的原型鏈上的
//我們要把靜態(tài)的函數(shù)直接寫(xiě)到類層次上
//定義一個(gè)接口類
var Interface=function (name,methods) {//name:接口名字
  if(arguments.length<2){
    alert("必須是兩個(gè)參數(shù)")
  }
  this.name=name;
  this.methods=[];//定義一個(gè)空數(shù)組裝載函數(shù)名
  for(var i=0;i<methods.length;i++){
    if(typeof methods[i]!="string"){
      alert("函數(shù)名必須是字符串類型");
    }else {
      this.methods.push( methods[i]);
    }
  }
};
Interface.ensureImplement=function (object) {
  if(arguments.length<2){
    throw new Error("參數(shù)必須不少于2個(gè)")
    return false;
  }
  for(var i=1;i<arguments.length;i++){
    var inter=arguments[i];
    //如果是接口就必須是Interface類型
    if(inter.constructor!=Interface){
      throw new Error("如果是接口類的話,就必須是Interface類型");
    }
    //判斷接口中的方法是否全部實(shí)現(xiàn)
    //遍歷函數(shù)集合
    for(var j=0;j<inter.methods.length;j++){
      var method=inter.methods[j];//接口中所有函數(shù)

      //object[method]傳入的函數(shù)
      //最終是判斷傳入的函數(shù)是否與接口中所用函數(shù)匹配
      if(!object[method]||typeof object[method]!="function" ){//實(shí)現(xiàn)類中必須有方法名字與接口中所用方法名相同
        throw new Error("實(shí)現(xiàn)類中沒(méi)有完全實(shí)現(xiàn)接口中的所有方法")
      }
    }
  }
}

(1)統(tǒng)一接口

var composite=new Interface("composite",["getChildByName","add"]);//側(cè)重點(diǎn)獲取子
var student=new Interface("composite",["goToClass","finishClass"]);//側(cè)重點(diǎn)為每個(gè)對(duì)象的實(shí)現(xiàn)

(2)定義組合類

 var compositeObj=function (name) {
         this.name=name;
         this.type="com";//默認(rèn)是組合類
         var childs=new Array();
        //得到相關(guān)的所有孩子節(jié)點(diǎn)
         this.getChildByName=function (name) {
           //涉及到遞歸
           var toChilds=new Array();
           if(!name){
             for(var i=0;i<childs.length;i++){
                if(childs[i].type=="com"){
                  toChilds=toChilds.concat(childs[i].getChildByName())
                }else {
                  toChilds.push(childs[i]);
                }
             }
           }else {
             for (var i = 0; i < childs.length; i++){
               if(childs[i].name==name){
                 if(childs[i].type=="com"){
                   toChilds=toChilds.concat(childs[i].getChildByName());
                   break;
                 }else {
                   toChilds.push(childs[i]);
                   break;
                 }
               }else {
                 if(childs[i].type == "com"){
                   toChilds =toChilds.concat(childs[i].getChildByName(name));
                 }
               }
             }
               }
               return toChilds;
         };
         //增加子節(jié)點(diǎn)
         this.add=function (child) {
           childs.push(child);
           return this;
         };
         //去上課
        this.goToClass=function (name) {
        var toChilds=this.getChildByName(name);
         for(var i=0;i<toChilds.length;i++){
              toChilds[i].goToClass();
         }
      };
          //下課
         this.finishClass=function (name) {
      var toChilds=this.getChildByName(name);
      for(var i=0;i<toChilds.length;i++){
        toChilds[i].finishClass();
      }
    };
    Interface.ensureImplement(this,composite,student);
    };

(3)定義葉子類

  var studentObj=function (name) {
    this.name=name;
    this.type="student";//默認(rèn)是葉子
    //得到所有孩子節(jié)點(diǎn)
   this.getChildByName=function (name) {
     if(this.name==name){
       return this;
     }else {
       return null;
     }
   }
   //增加子節(jié)點(diǎn)
    this.add=function (child) {
      throw new Error("add 不成被初始化(在葉子了中)")
    }
    //去上課
    this.goToClass = function(name){
      document.write(this.name +" 去上課<br>");
    }
    //下課
    this.finishClass = function(name){
      document.write(this.name +" 下課<br>");
    }
    Interface.ensureImplement(this,composite,student);
  }

(4)應(yīng)用---將學(xué)校,班級(jí),組,學(xué)生關(guān)聯(lián)起來(lái)

 var astudent=new studentObj("我是a同學(xué)");
  var bstudent=new studentObj("我是b同學(xué)");
  var cstudent=new studentObj("我是c同學(xué)");
  var dstudent=new studentObj("我是d同學(xué)");
  var estudent=new studentObj("我是e同學(xué)");
  var fstudent=new studentObj("我是f同學(xué)");
  var gstudent=new studentObj("我是g同學(xué)");
  var hstudent=new studentObj("我是h同學(xué)");
  var istudent=new studentObj("我是i同學(xué)");

  var one = new compositeObj("一班");
  var oneOne = new compositeObj("一班一組");
  oneOne.add(astudent).add(bstudent);
  var oneTwo = new compositeObj("一班二組");
  oneTwo.add(cstudent).add(dstudent);

  one.add(oneOne).add(oneTwo);
  var two = new compositeObj("二班");
  var twoOne = new compositeObj("二班一組");
  twoOne.add(estudent).add(fstudent);
  var twoTwo = new compositeObj("二班二組");
  twoTwo.add(gstudent).add(hstudent).add(istudent)
  two.add(twoOne).add(twoTwo);
  var usPcat = new compositeObj("組合設(shè)計(jì)模式培訓(xùn)學(xué)校");
  usPcat.add(one).add(two);

(5)客戶端調(diào)用API,只需要簡(jiǎn)單的安排去上課即可,也就是客戶端只需要寫(xiě)去上課的代碼即可

usPcat.goToClass();
document.write("-------------------------<br>");
usPcat.goToClass("一班");
document.write("-------------------------<br>");
usPcat.goToClass("二班一組");

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具http://tools.jb51.net/code/HtmlJsRun測(cè)試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《javascript面向?qū)ο笕腴T(mén)教程》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論