組合模式

FreeZinG 發布于2019-08-26 10:24 / 1289人閱讀

摘要：更多前端技術和知識點，搜索訂閱號菌訂閱組合模式在對象間形成樹形結構組合模式中基本對象和組合對象被一致對待無須關心對象有多少層調用時只需在根部進行調用實現原理創建宏任務并維護一個任務列表創建宏任務方法將到中創建方法循環遍歷中的對象對象必須擁有

?? 更多前端技術和知識點，搜索訂閱號 JS 菌 訂閱

組合模式在對象間形成樹形結構;

組合模式中基本對象和組合對象被一致對待;

無須關心對象有多少層, 調用時只需在根部進行調用;

實現原理

創建宏任務并維護一個任務列表 list

創建宏任務方法 add 將 task push 到 list 中

創建 execute 方法循環遍歷 list 中的 task 對象

task 對象必須擁有一個名為 execute 的方法（用來在宏任務中遍歷 list）

代碼實現

const MacroCommand = function() {
    this.lists = [] // 宏任務維護一個任務列表
}
MacroCommand.prototype.add = function(task) {
    this.lists.push(task) // add 方法增加任務
}
MacroCommand.prototype.execute = function() {
    for (let index = 0; index < this.lists.length; index++) {
        this.lists[index].execute() // execute 方法執行任務
    }
}

const command1 = new MacroCommand() // 通過 new 操作符創建任務

command1.add({
    execute: () => { console.log("command1-1") }
})

command1.add({
    execute: () => { console.log("command1-2") }
})

const command2 = new MacroCommand()

command2.add({
    execute: () => { console.log("command2-1") }
})

command2.add({
    execute: () => { console.log("command2-2") }
})

command2.add({
    execute: () => { console.log("command2-3") }
})

const macroCommand = new MacroCommand() // 假定 macroCommand 為宏任務

macroCommand.add(command1) // 將其他子任務推如任務列表
macroCommand.add(command2)

macroCommand.execute() // 宏命令執行操作后，command 將依次遞歸執行
// command1-1
// command1-2
// command2-1
// command2-2
// command2-3

應用 掃描文件夾

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

const Folder = function(folder) {
    this.folder = folder
    this.lists = []
}
Folder.prototype.add = function(res) {
    this.lists.push(res)
}
Folder.prototype.scan = function() {
    console.log(`開始掃描文件夾: ${this.folder}`)
    for (let index = 0; index < this.lists.length; index++) {
        this.lists[index].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("其他")

const file = new File("JS prototype")
const file1 = new File("CSS 編程藝術")
const file2 = new File("HTML 標記語言")
const file3 = new File("HTTP-TCP-IP")

folder.add(folder1)
folder.add(folder2)

folder1.add(file)
folder2.add(file1)
folder2.add(file2)
folder2.add(file3)

folder.scan()

// 開始掃描文件夾: 根文件夾
// 開始掃描文件夾: JS
// 開始掃描文件: JS prototype
// 開始掃描文件夾: 其他
// 開始掃描文件: CSS 編程藝術
// 開始掃描文件: HTML 標記語言
// 開始掃描文件: HTTP-TCP-IP

請關注我的訂閱號，不定期推送有關 JS 的技術文章，只談技術不談八卦

GPU云服務器云服務器組合模式組合數組隨機組合資產組合組合報警

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

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

設計模式之組合模式

摘要：安全式組合模式中的抽象構件不聲明管理子類的接口，把操作移交給子類完成。組合模式實現樣例使用組合模式實現目錄和課程之間的關系。 0x01.定義與類型定義：將對象組合成樹形結構以表示部分-整體的層次結構，使客戶端對單個對象和組合對象保持一致的方式處理組合模式實現的最關鍵的地方是：簡單對象和復合對象必須實現相同的接口，這就是組合模式能夠將組合對象和簡單對象進行一致處理的原因。類型：結...

jsdt 2019-08-19 10:26 評論0 收藏0
js組合模式和寄生組合模式的區別研究

摘要：組合模式繼承結合了構造函數繼承時可以為每個屬性重新初始化，構造一個副本的優點，以及原型鏈繼承時一次定義處處共享的優點。但令我百思不得其解的是，從上面給出的例子來看，組合繼承并沒有調用兩次超類型構造函數。最近在閱讀《js權威指南》的繼承這一章，對于組合模式和寄生組合模式的區別有點混淆，在多次重讀以及嘗試之后，得到一些心得。組合模式繼承結合了構造函數繼承時可以為每個屬性重新初始化，構...

tolerious 2019-08-23 15:24 評論0 收藏0
聽飛狐聊JavaScript設計模式系列12

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

HitenDev 2019-08-19 17:13 評論0 收藏0
一起學設計模式 - 組合模式

摘要：組合模式的圖組成部分組合對象為組合中的對象聲明接口，在適當的情況下，實現所有類共有接口的默認行為，聲明用于訪問和管理其子組件的接口。組合模式對單個對象葉子對象和組合對象容器對象的使用具有一致性。組合模式（Composite Pattern）屬于結構型模式的一種，組合多個對象形成樹形結構來表示部分 - 整體的結構層次，對單個對象（葉子對象）和組合對象（容器對象）的使用具有一致性概述...

toddmark 2019-08-15 12:29 評論0 收藏0
設計模式-組合模式

摘要：組合對象包括部件對象和葉對象葉對象相當于最小粒度不可再劃分而部件對象也是組合對象是由葉對象組合而成小的組合對象再經過不斷組合就成為一個大的組合對象大的組合對象再次組裝就是一個整體代碼通過組合模式組合起來之后具體執行請求時是從上而下沿著樹形結組合對象,包括部件對象和葉對象.葉對象相當于最小粒度,不可再劃分;而部件對象也是組合對象,是由葉對象組合而成.小的組合對象再經過不斷組合,就成為一...

Olivia 2019-08-20 15:07 評論0 收藏0
【面向對象的PHP】之模式：組合

摘要：我們可以做一些小改進將的拋出異常代碼挪入父類屬于最小單位。完整代碼當我們需要在某個子類，實現個性化的業務邏輯時，組合模式的缺陷之一正在顯現出來簡化的前提是所有的類都繼承同一個基類，簡化優點有時是以降低對象安全為代價。開篇如果你注意了目錄，會知道：組合是一個新的開始。在系統代碼設計的過程中，我們通過繼承來組織代碼，父類與子類，實質上對應了業務的整體規范與具體需求。所以，我們需要將類按...

546669204 2019-06-27 16:29 評論0 收藏0