组合模式

FreeZinG 发布于2019-08-26 10:24 / 1285人阅读

摘要：更多前端技术和知识点，搜索订阅号菌订阅组合模式在对象间形成树形结构组合模式中基本对象和组合对象被一致对待无须关心对象有多少层调用时只需在根部进行调用实现原理创建宏任务并维护一个任务列表创建宏任务方法将到中创建方法循环遍历中的对象对象必须拥有

⭐️ 更多前端技术和知识点，搜索订阅号 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云服务器云服务器组合模式组合数组随机组合资产组合组合报警

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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