JavaScript使用引入組合模式的方法

發(fā)布時間：2020-07-22 14:43:58 來源：億速云閱讀：168 作者：小豬欄目：web開發(fā)

這篇文章主要講解了JavaScript使用引入組合模式的方法，內(nèi)容清晰明了，對此有興趣的小伙伴可以學(xué)習(xí)一下，相信大家閱讀完之后會有幫助。

首先：

使用一個例子來引入組合模式，需求為
（1）有一個學(xué)校有2個班(一班,二班)
（2）每個班級分2個小組(一班一組,一班二組,二班一組,二班二組)
（3）學(xué)校計算機教室有限,每一個小組分著來上課

然后：根據(jù)需求我們可以簡單看出這里面涉及到學(xué)校，班級，組，和學(xué)生總共4個類

使用程序模擬這4個類為，

（1）學(xué)校類

 var school=function (name) {
  this.name=name;
  var classes=new Array();
   this.addClasses=function (cla) {
   classes.push(classe);
   }
   this.getClass=function () {
    return classes;
   }
 }

（2）班級類

//班級類
 var classes=function (name) {
  this.name = name;
  var groups = new Array();
  this.addGroup = function (group) {
   groups.push(group);
   return this;
  };
  this.getGroups = function () {
   return groups;
  }
 };

（3）組類

 //組
 var group=function (name) {
  this.name=name;
  var students=new Array();
  var addStudents=function (student) {
   students.push(student);
   return this;
  }
   this.geStudent=function () {
    return students;
   }
 };

（4）學(xué)生類

 //學(xué)生類
  var student=function (name) {
   this.name=name;
   this.gotoClass=function () {
    document.write(name+"：我是學(xué)生，我要去上課 ")
   };
   this.finishClass=function () {
    document.write(name+": 終于下課了");
   }
  };

其次，測試需滿足如下為：

（1）每個班級分2個小組(一班一組,一班二組,二班一組,二班二組)
（2）學(xué)校計算機教室有限,每一個小組的學(xué)生分著來上課
（3）現(xiàn)在我們倒著寫，從學(xué)生-->組->班級-->學(xué)校

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

//班級實例(1)
  var class1=new classes("一班");
  //組1
 var oneOne=new group("一班一組");
  //組中添加學(xué)生
 oneOne.addStudents(astudent).addStudents(bstudent);
 //組2
 var oneTwo=new group("一班二組");
 //組中添加學(xué)生
 oneTwo.addStudents(cstudent).addStudents(dstudent);

 class1.addGroup(oneOne).addGroup(oneTwo);
 //班級實例2
 var class2=new classes("二班");
 //組1
 var towOne=new group("二班一組");
 //組中添加學(xué)生
 towOne.addStudents(estudent).addStudents(fstudent);

 //組2
 var towTwo=new group("二班二組");
 //組中添加學(xué)生
 towTwo.addStudents(gstudent).addStudents(hstudent).addStudents(istudent);
 //
 class2.addGroup(towOne).addGroup(towTwo);

 //學(xué)校實例
 var usSchool=new school("組合模式學(xué)校");

最后，開學(xué)了，我們準(zhǔn)備按照要求去上課吧，

安排為：一班一組去上課學(xué)校-->班級-->組-->學(xué)生

 var classes=usSchool.getClass();//班級
  for(var i=0;i<classes.length;i++){
   if(classes[i].name=="一班"){
    for(var j=0;j<classes[i].getGroups().length;j++){
     if(classes[i].classes[i].getGroups()[j]=="一組"){
      var students=classes[i].classes[i].getGroups()[j].geStudent();
      for(var k=0;k<students.length;k++){
       students[k].gotoClass();
      }
     }
    }
   }
  }

最后，我只是想安排一個都要寫這么多的代碼，那如何是一個學(xué)校有上千個班級，那么要瘋了。

這種一定不適合業(yè)務(wù)的擴展，為此我們使用組合模式來解決上述的問題。
為啥要用設(shè)計模式呢？
因為設(shè)計模式有如下的一些操作方式：
（1）組合模式中把對象分為兩種(組合對象,和葉子對象)
（2）組合對象和葉子對象實現(xiàn):同一批操作
（3）對組合對象執(zhí)行的操作可以向下傳遞到葉子節(jié)點進(jìn)行操作
（4）這樣就會弱化類與類之間的耦合
（5）他常用的手法是把對象組合成屬性結(jié)構(gòu)的對象

看完上述內(nèi)容，是不是對JavaScript使用引入組合模式的方法有進(jìn)一步的了解，如果還想學(xué)習(xí)更多內(nèi)容，歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

JavaScript使用引入組合模式的方法

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽