javascript 組合模式

Carson 發布于2019-08-26 10:42 / 747人閱讀

摘要：開始掃描文件夾文件下不能添加其他文件夾或文件開始掃描文件根文件加技術棧權威小王子

組合模式

**// 組合模式在對象間形成樹形結構
// 組合模式中基本對象和組合對象被一致對待
// 無須關心對象有多少層調用時只需要在根部進行調用**
結合了命令模式和組合模式的具體實現:

    const MacroCommand = function () {
      return {
        lists: [],
        add: function (task) {
          this.lists.push(task)
        },
        excute: function () { //組合對象調用這里的excute
          for (let i = 0; i < this.lists.length; i++) {
            this.lists[i].excute()
          }
        }
      }
    }
    const command1 = MacroCommand() //基本對象
    command1.add({
      excute: () => console.log("煮咖啡") //基本對象調用這里的excute
    })
    const command2 = MacroCommand()
    command2.add({
      excute: () => console.log("打開電視")
    })
    command2.add({
      excute: () => console.log("打開音響")
    })
    const command3 = MacroCommand()
    command3.add({
      excute: () => console.log("打開空調")
    })
    command3.add({
      excute: () => console.log("打開電腦")
    })
    console.log(command1.lists) //所對應的內存地址不一樣
    console.log(command2.lists) //所以lists 保存的不一樣
    console.log(command3.lists)

    const macroCommand = MacroCommand()
    macroCommand.add(command2) //分次放入不同的參數
    macroCommand.add(command3) // 函數的引用不變，對應的就是同 
                                 //一個堆
     macroCommand.add(command1)
     //最后把command1、2、3都放入數組中 調用excute,觸發每一個數 
      //組中的excute方法
    macroCommand.excute()

demo2 —— 掃描文件夾
掃描文件夾時, 文件夾下面可以為另一個文件夾也可以為文件, 我們希望統一對待這些文件夾和文件, 這種情形適合使用組合模式。

   const Folder = function(folder){
    this.folder = folder
    this.lists = []
   }
   Folder.prototype.add = function(resource){
     this.lists.push(resource)
   }
   Folder.prototype.scan = function(){
     console.log("開始掃描文件夾",this.folder)
     for(let i =0,folder; folder = this.lists[i++];){
       folder.scan()
     }
   }
   const File = function(file){
     this.file = file
   }
   File.prototype.add = function(){
     throw Error("文件下不能添加其他文件夾或文件")
   }
   File.prototype.scan = function(){
     console.log("開始掃描文件",this.file)
   }
   const folder = new Folder("根文件加")
   const folder1 = new Folder("JS")
   const folder2 = new Folder("life")
   const file1 = new File("js技術棧")
   const file2 = new File("權威")
   const file3 = new File("小王子")
   folder1.add(file1)
   folder1.add(file2)
   folder2.add(file3)
   folder.add(folder1)
   folder.add(folder2)
   folder.scan()

GPU云服務器云服務器組合模式 javascript命令模式 javascript嚴格模式 javascript設計模式

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106641.html

聽飛狐聊JavaScript設計模式系列12

摘要：，對組合對象執行的操作可以向下傳遞到葉子節點進行操作。組合模式之圖片庫圖片庫可以有選擇地隱藏或顯示圖片庫的全部或某一部分單獨的或是部分的。本回內容介紹上一回，聊了橋接模式，做了一道計算題；介一回，聊組合模式（Composite），官方描述組合模式將對象組合成樹形結構以表示部分-整體的層次結構，組合模式使得用戶對單個對象和組合對象的使用具有一致性。組合模式特性這里我理了一下，就組...

HitenDev 2019-08-19 17:13 評論0 收藏0
JavaScript設計模式-第一部分：單例模式、組合模式和外觀模式

摘要：但是，這并不是采用單例的唯一原因。使用命名空間單例模式也被稱為模塊設計模式。函數內部聲明了一些局部函數和或變量。緊隨函數聲明放置即可立即執行外部函數，并將所得的對象文字費賠給變量。 JavaScript設計模式-第一部分：單例模式、組合模式和外觀模式設計模式是一些可靠的編程方式，有助于保證代碼更加易于維護、擴展及分離，所有設計模式在創建大型JavaScript應用程序時均不可或缺單...

betacat 2019-08-20 13:38 評論0 收藏0
JavaScript設計模式（八）：組合模式

摘要：不同于其它靜態編程語言，實現組合模式的難點是保持樹對象與葉對象之間接口保持統一，可借助定制接口規范，實現類型約束。誤區規避組合不是繼承，樹葉對象并不是父子對象組合模式的樹型結構是一種聚合的關系，而不是。 showImg(https://segmentfault.com/img/bVbu79V?w=800&h=600); 組合模式：又叫部分整體模式，將對象組合成樹形結構，以表示部分...

leon 2019-08-26 18:36 評論0 收藏0
js設計模式--組合模式

摘要：文章系列設計模式單例模式設計模式策略模式設計模式代理模式設計模式迭代器模式設計模式發布訂閱模式設計模式命令模式概念組合模式就是用小的子對象來構建更大的對象，而這些小的子對象本身也許是由更小的孫對象構成的。前言本系列文章主要根據《JavaScript設計模式與開發實踐》整理而來，其中會加入了一些自己的思考。希望對大家有所幫助。文章系列 js設計模式--單例模式 js設計模式--策略...

blankyao 2019-08-23 14:31 評論0 收藏0
JavaScript繼承模式

摘要：組合繼承組合繼承有時也叫偽經典繼承，該繼承模式將原型鏈和借用構造函數的技術結合在一起實現。寄生組合式繼承通過借用構造函數來繼承屬性，通過原型鏈的混成形式來繼承方法。原文地址：JavaScript實現繼承眾所周知，JavaScript 這門語言在 ES6 出來之前是沒有類（class）這一概念的，所以 JavaScript 中的類都是通過原型鏈來實現的。同樣，使用 JavaScrip...

DrizzleX 2019-08-20 19:05 評論0 收藏0