装饰器模式
时间:2022-07-26
本文章向大家介绍装饰器模式,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
装饰器模式
装饰器模式Decorator Pattern
允许向一个现有的对象添加新的功能,同时又不改变其结构,这种类型的设计模式属于结构型模式,是作为现有的类的一个包装。这种模式创建了一个装饰类,用来包装原有的类,并在保持类方法完整性的前提下,提供了额外的功能。
描述
一般有两种方式可以实现给一个类或对象增加行为:
- 继承机制,使用继承机制是给现有类添加功能的一种有效途径,通过继承一个现有类可以使得子类在拥有自身方法的同时还拥有父类的方法。但是这种方法是静态的,用户不能控制增加行为的方式和时机。
- 关联机制,即将一个类的对象嵌入另一个对象中,由另一个对象来决定是否调用嵌入对象的行为以便扩展自己的行为,我们称这个嵌入的对象为装饰器
Decorator
。
装饰模式以对客户透明的方式动态地给一个对象附加上更多的责任,也就是说客户端并不会觉得对象在装饰前和装饰后有什么不同,装饰模式可以在不需要创造更多子类的情况下,将对象的功能加以扩展。
模式结构
-
Component
: 抽象构件。 -
ConcreteComponent
: 具体构件。 -
Decorator
: 抽象装饰类。 -
ConcreteDecorator
: 具体装饰类。
优点
- 装饰模式与继承关系的目的都是要扩展对象的功能,但是装饰模式可以提供比继承更多的灵活性。
- 可以通过一种动态的方式来扩展一个对象的功能,通过配置文件可以在运行时选择不同的装饰器,从而实现不同的行为。
- 通过使用不同的具体装饰类以及这些装饰类的排列组合,可以创造出很多不同行为的组合。可以使用多个具体装饰类来装饰同一对象,得到功能更为强大的对象。
- 具体构件类与具体装饰类可以独立变化,用户可以根据需要增加新的具体构件类和具体装饰类,在使用时再对其进行组合,原有代码无须改变,符合开闭原则。
缺点
- 使用装饰模式进行系统设计时将产生很多小对象,这些对象的区别在于它们之间相互连接的方式有所不同,而不是它们的类或者属性值有所不同,同时还将产生很多具体装饰类。这些装饰类和小对象的产生将增加系统的复杂度,加大学习与理解的难度。
- 这种比继承更加灵活机动的特性,也同时意味着装饰模式比继承更加易于出错,排错也很困难,对于多次装饰的对象,调试时寻找错误可能需要逐级排查,较为烦琐。
适用环境
- 在不影响其他对象的情况下,以动态、透明的方式给单个对象添加职责。
- 需要动态地给一个对象增加功能,这些功能也可以动态地被撤销。
- 当不能采用继承的方式对系统进行扩充或者采用继承不利于系统扩展和维护时。不能采用继承的情况主要有两类:第一类是系统中存在大量独立的扩展,为支持每一种组合将产生大量的子类,使得子类数目呈爆炸性增长;第二类是因为类定义不能继承例如
final
类。
实现
class Component{
say(){
throw new Error("Abstract method cannot be called");
}
}
class ConcreteComponent extends Component{
say(){
console.log("ConcreteComponent");
}
}
class Decorator extends Component{
constructor(concreteComponent){
super();
this.concreteComponent = concreteComponent;
}
say(){
this.concreteComponent.say();
}
}
class ConcreteDecorator extends Decorator{
constructor(concreteComponent){
super(concreteComponent);
}
say(){
console.log("Decoratored ConcreteComponent");
}
}
(function(){
var concreteComponent = new ConcreteComponent();
concreteComponent.say(); // ConcreteComponent
var decoratoredConcreteComponent = new ConcreteDecorator(concreteComponent);
decoratoredConcreteComponent.say(); // Decoratored ConcreteComponent
})();
每日一题
https://github.com/WindrunnerMax/EveryDay
参考
https://imweb.io/topic/5b1403bbd4c96b9b1b4c4e9e
https://www.runoob.com/design-pattern/decorator-pattern.html
https://design-patterns.readthedocs.io/zh_CN/latest/structural_patterns/decorator.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- CNN+ Auto-Encoder 实现无监督Sentence Embedding ( 基于Tensorflow)
- R语言数据可视化分析案例:探索BRFSS数据
- R语言探索BRFSS数据可视化
- 基于ThinkPhp6.0+Vue 开发的一套免费开源新零售商城系统
- Kubernetes之RBAC权限管理
- 这是一份 pip 常用命令小结~
- 聊聊claudb的Database
- WebSocket 初识篇
- (一)MessageQueue之消息入队
- 宇智波程序笔记2-kafka 生产发送消息失败无响应,
- 高并发系统三大利器之缓存
- Nuxt.js框架(SSR)学习笔记
- 也谈状态模式
- BFE.dev前端刷题1 - 实现curry()
- BFE.dev前端刷题2 - 实现curry() 并支持placeholder