[设计模式] javascript 之 装饰者模式
装饰者模式说明
说明:通一个类来动态的对另一个类的功能对象进行前或后的修饰,给它辅加一些额外的功能; 这是对一个类对象功能的装饰,装饰的类跟被装饰的类,要求拥有相同的访问接口方法(功能),这在动态面向对象类里,一般以实现同一个接口(interface)来约束实现;装饰类的要有对被装饰类的引用,用于在装饰类的相应方法,调用相应被装饰类的方法,然后对其进行修饰;
场景举例:
1>. 比如我们生活中的穿衣服, 一件衬衣,一件西装外套,一条裤子,一条领带,一双漂亮的皮鞋; 每多穿一件,都是对前面一件或全身的装饰;
2>. 比如我们有个类下的功能方法,可能用于写日志,可能用于用户登陆这样的功能,也许写入日志前需要获取当前操作者信息,或是登录成功后,写入一条日志;写入日志之前的额外操作,它的总体来说也还是一个写日志的目的;登孙成功后写日志,它总体上也是一个登录过程的操作信息;
因此装饰者模式用于实现,两者相似操作的一种场景;就是装饰者对被装饰者功能对象的扩展,本质还是原方法相同的功能范围;
实例源码
1. 被装饰者类
function Wear() { } Wear.prototype.Shirt = function() {
//穿了件衬衫
console.log('穿上衬衫');
}
2. 装饰者类
function Decorator(wear) {
this.wear = wear;
} Decorator.prototype.Shirt = function() {
this.wear.Shirt();
//穿了件衬衫后,我又加上了领带
}
3. 使用方法
var wear = new Wear();
var decorator = new Decorator(wear);
decorator.Shirt();
这样就实现了对 Wear 穿衬衫这个功能对象的动态扩展装饰,你也不必知道原被装饰方法是如何执行,只要知道它的功能是什么就可以,然后知道我们要对其辅加的额外功能是什么就可以;
其他说明
装饰者模式,真正提现了面向对象方法的:对扩展开放,对修改关闭的原则;所有想要的功能方法,都是在没有修改[被装饰类Wear]在扩展[装饰者这个类Decorator]的情况下进行的;
装饰者模式的一个主要特点,就是装饰者对被装饰者的引用,以实现对被装饰者的无修改装饰;
模拟下:先穿衬衫,再穿领带,再穿西装的场景: 上面的被装饰者不变了:
2. 装饰者类:
function Decorator(wear) {
this.wear = wear;
}
Decorator.prototype.Shirt = function() {
this.wear.Shirt(); //这里只穿衬衫;
}
3. 创建类似继承 Decorator 子类的 穿领带类与穿西装类
function Decorator_Tie(decorator) {
this.decorator = decorator;
}
Decorator_Tie.prototype.Shirt = function() {
this.decorator.Shirt(); //穿上衬衫
console.log('再戴上领带');
} function Decorator_Western (decorator) {
this.decorator = decorator;
}
Decorator_Western.prototype.Shirt = function() {
this.decorator.Shirt();
console.log('再穿上西装');
}
使用方法:
//先穿上衬衫
var wear = new Wear();
var decorator = new Decorator(wear);
//decorator.Shirt();
//再戴上领带
var tie = new Decorator_Tie(decorator);
//tie.Shirt();
//再穿上西装
var western = new Decorator_Western(tie);
western.Shirt();
这就是一个穿衣服装饰的模拟例子;
[设计模式] javascript 之 装饰者模式的更多相关文章
- JAVA设计模式之【装饰者模式】
JAVA设计模式之[装饰者模式] 装饰模式 对新房进行装修并没有改变房屋的本质,但它可以让房子变得更漂亮.更温馨.更实用. 在软件设计中,对已有对象(新房)的功能进行扩展(装修). 把通用功能封装在装 ...
- javascript的装饰者模式Decorator
刚开始看这段代码有点绕,现在回过头来看,so easy! Function.prototype.before = function(beforefn){ var _self = this; retur ...
- 【读书笔记】读《JavaScript设计模式》之装饰者模式
一.定义 装饰者模式可用来透明地把对象包装在具有同样接口的另一个对象之中.这样一来,你可以给一个方法添加一些行为,然后将方法调用传递给原始对象.相对于创建子类来说,使用装饰者对象是一种更灵活的选择(装 ...
- JavaScript高级---装饰者模式设计
一.设计模式 javascript里面给我们提供了很多种设计模式: 工厂.桥.组合.门面.适配器.装饰者.享元.代理.观察者.命令.责任链 在前面我们实现了工厂模式和桥模式 工厂模式 : 核心:为了生 ...
- Java设计模式12:装饰器模式
装饰器模式 装饰器模式又称为包装(Wrapper)模式.装饰器模式以多客户端透明的方式扩展对象的功能,是继承关系的一个替代方案. 装饰器模式的结构 通常给对象添加功能,要么直接修改对象添加相应的功能, ...
- 设计模式学习心得<装饰器模式 Decorator>
装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创建了一个装饰类,用来包装 ...
- 设计模式のDecoratorPattern(装饰器模式)----结构模式
一.产生背景 装饰器模式(Decorator Pattern)允许向一个现有的对象添加新的功能,同时又不改变其结构.这种类型的设计模式属于结构型模式,它是作为现有的类的一个包装. 这种模式创建了一个装 ...
- 设计模式C++实现——装饰者模式
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/walkerkalr/article/details/28633123 模式定义: 装 ...
- 重学 Java 设计模式:实战装饰器模式(SSO单点登录功能扩展,增加拦截用户访问方法范围场景)
作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言 对于代码你有编程感觉吗 很多人写代码往往是没有编程感觉的,也就是除了可以把功能按照固 ...
随机推荐
- jquery发送异步请求
var remark = $("#"+id+"remark").val(); var shopid = $("#"+id+"sho ...
- linux内核宏container_of
首先来个简单版本 /* given a pointer @ptr to the field @member embedded into type (usually * struct) @type, r ...
- 1.素数判定(如何输出\n,\t,不用关键字冲突)
题目描述 Description 质数又称素数.指在一个大于1的自然数中,除了1和此整数自身外,不能被其他自然数整除的数. 素数在数论中有着很重要的地位.比1大但不是素数的数称为合数.1和0既非素数也 ...
- JAVASE笔记回顾
第一部分,JAVA基础和面向对象 part01 入门与开发环境搭建 1: 计算机基础知识(了解)(1)计算机(2)计算机硬件(3)计算机软件系统软件:windows,linux,mac应用软件:QQ, ...
- Android中Adapter之BaseAdapter使用
Android界面中有时候需要显示稍微复杂的界面时,就需要我们自定义一个adapter,而此adapter就要继承BaseAdapter,重新其中的方法. Android中Adapte ...
- java 为啥变量名前要加个m?
用m_开头表示类的成员变量,member的意思如果是全局变量,则由g_开头还有常量c_开头 静态变量s_开头
- 关于JAVA应用中文字体显示小方框的问题解决
最近碰到linux下jboss应用中中文字体显示为小方框: “在JRE 5以上的java环境中,java会自动加载$JAVA_HOME/jre/lib/fonts目录下的字体.链接或复制宋体或微软雅黑 ...
- 常用Eclipse插件在线安装地址
Srping IDE http://www.springsource.com/update/e3.5 EasyShellhttp://pluginbox.sourceforge.net M2E ...
- vmware12安装vmtools
一. 1. 机器要开启支持BIOS的选项. 二. 1. 点击vmware 应用 vmware install 2. 虚拟机: tar xvf vmtools-distb.tgr.gz 3. 虚拟机: ...
- git 添加文件
git 添加文件三步骤 git add filename git commit -m 'remarks' git push origin master