日本阿v片在线播放免费,成人国产片视频在线观看,日韩黄片毛片在线观看,一区亚洲电影,琪琪秋霞午夜av影视在线,中文字幕在线视频不卡,最新大伊香蕉精品视频在线,亚洲AV无码日韩一区二区乱 

  
      
    

      

	
      
		
      
			
      
				
      JS設(shè)計(jì)模式之單例模式、組合模式、觀察者模式、策略模式
      
				
      
					
       2020-3-18      前端達(dá)人      
      
					
					
      
						
					
      
				
      
				
			
      
			
      
				
      好，下面我將結(jié)合一些實(shí)例，說(shuō)一下我對(duì)組合模式以及觀察者模式的了解：

      


      
1、組合模式：

      


      
組合模式在對(duì)象間形成樹(shù)形結(jié)構(gòu);

      
組合模式中基本對(duì)象和組合對(duì)象被一致對(duì)待;

      
無(wú)須關(guān)心對(duì)象有多少層, 調(diào)用時(shí)只需在根部進(jìn)行調(diào)用;

      
將多個(gè)對(duì)象的功能，組裝起來(lái)，實(shí)現(xiàn)批量執(zhí)行；

      
想象我們現(xiàn)在手上有個(gè)萬(wàn)能遙控器, 當(dāng)我們回家, 按一下開(kāi)關(guān), 下列事情將被執(zhí)行:

      


      
到家了，開(kāi)門(mén)

      
開(kāi)電腦

      
開(kāi)音樂(lè)
      

      
    
      

      

      
    
      

      

      
    
      

      

      // 先準(zhǔn)備一些需要批量執(zhí)行的功能
class GoHome{
    init(){
        console.log("到家了，開(kāi)門(mén)");
    }
}
class OpenComputer{
    init(){
        console.log("開(kāi)電腦");
    }
}
class OpenMusic{
    init(){
        console.log("開(kāi)音樂(lè)");
    }
}

// 組合器，用來(lái)組合功能
class Comb{
    constructor(){
        // 準(zhǔn)備容器，用來(lái)防止將來(lái)組合起來(lái)的功能
        this.skills = [];
    }
    // 用來(lái)組合的功能，接收要組合的對(duì)象
    add(task){
        // 向容器中填入，將來(lái)準(zhǔn)備批量使用的對(duì)象
        this.skills.push(task);
    }
    // 用來(lái)批量執(zhí)行的功能
    action(){
        // 拿到容器中所有的對(duì)象，才能批量執(zhí)行
        this.skills.forEach( val => {
            val.init();
        } );
    }
}

// 創(chuàng)建一個(gè)組合器
var c = new Comb();

// 提前將，將來(lái)要批量操作的對(duì)象，組合起來(lái)
c.add( new GoHome() );
c.add( new OpenComputer() );
c.add( new OpenMusic() );

// 等待何時(shí)的時(shí)機(jī)，執(zhí)行組合器的啟動(dòng)功能
c.action();
    // 在內(nèi)部，會(huì)自動(dòng)執(zhí)行所有已經(jīng)組合起來(lái)的對(duì)象的功能

      

      
    
      

      

      
    
      

      

      
    由此，我們可以總結(jié)一下組合模式的特點(diǎn)：

      

      
    
      
      

      

      
    1.批量執(zhí)行
      
2.啟動(dòng)一個(gè)方法，會(huì)遍歷多個(gè)方法，同時(shí)執(zhí)行，有點(diǎn)類(lèi)似于遞歸的感覺(jué)
      
3.組合模式略微耗性能，但是執(zhí)行方便
      
 目前只是一個(gè)基礎(chǔ)組合。
      
 高級(jí)組合：
      
1.組合成樹(shù)狀結(jié)構(gòu)，每個(gè)對(duì)象下，還會(huì)有自己的子對(duì)象
      
2.如果執(zhí)行了父對(duì)象的某個(gè)方法，所有的子對(duì)象會(huì)跟隨執(zhí)行
      
3.組合模式一般建議使用在動(dòng)態(tài)的html結(jié)構(gòu)上，因?yàn)榻M合模式的結(jié)構(gòu)和html的結(jié)構(gòu)，出奇的一致
      
4.基本對(duì)象和組合對(duì)象被一致對(duì)待, 所以要保證基本對(duì)象(葉對(duì)象)和組合對(duì)象具有一致方法
      

      

      
2、觀察者模式：
      

      
觀察者模式也叫也叫Observer模式、訂閱/發(fā)布模式，也是由GoF提出的23種軟件設(shè)計(jì)模式的一種。
      
觀察者模式是行為模式之一，它的作用是當(dāng)一個(gè)對(duì)象的狀態(tài)發(fā)生變化時(shí)，能夠自動(dòng)通知其他關(guān)聯(lián)對(duì)象，自動(dòng)刷新對(duì)象狀態(tài)，或者說(shuō)執(zhí)行對(duì)應(yīng)對(duì)象的方法（主題數(shù)據(jù)改變，通知其他相關(guān)個(gè)體，做出相應(yīng)的數(shù)據(jù)更新）。
      
這種設(shè)計(jì)模式可以大大降低程序模塊之間的耦合度，便于更加靈活的擴(kuò)展和維護(hù)。
      
以觀察的角度，發(fā)現(xiàn)對(duì)應(yīng)的狀況，處理問(wèn)題。
      
觀察者模式包含兩種角色：
      
①觀察者（訂閱者）：會(huì)隨時(shí)更新自身的信息或狀態(tài)（訂閱者可以隨時(shí)加入或離開(kāi)）；
      
②被觀察者（發(fā)布者）：接收到發(fā)布者發(fā)布的信息，從而做出對(duì)應(yīng)的改變或執(zhí)行。
      
很方便的實(shí)現(xiàn)簡(jiǎn)單的廣播通信，實(shí)現(xiàn)一對(duì)多的對(duì)應(yīng)關(guān)系。
      
核心思想：觀察者只要訂閱了被觀察者的事件，那么當(dāng)被觀察者的狀態(tài)改變時(shí)，被觀察者會(huì)主動(dòng)去通知觀察者，而無(wú)需關(guān)心觀察者得到事件后要去做什么，實(shí)際程序中可能是執(zhí)行訂閱者的回調(diào)函數(shù)。
      
Javascript中實(shí)現(xiàn)一個(gè)例子：
      

      
      

      

      
    
      

      				
      
								
			
      
		
      
		
		
	
      


      
    
  
      
    
      日歷
      
    
      
        
      
        
    
      
  
      
    
    
      
      
      鏈接
      
      
        
                
      
    
      
    
      
      
      個(gè)人資料
      
      
    
      
    
      
      
      存檔