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();

这就是一个穿衣服装饰的模拟例子;

时间: 2025-01-16 09:03:43

javascript 之 装饰者模式的相关文章

PHP、Python和Javascript的装饰器模式对比_php实例

修饰模式(Decorator Pattern),又叫装饰者模式,是面向对象编程领域中,一种动态地往一个类中添加新的行为的设计模式.就功能而言,修饰模式相比生成子类更为灵活,这样可以给某个对象而不是整个类添加一些功能.装饰模式非常适用于灵活扩展对象的功能,下面是装饰模式的UML图: 例如,有一个技术论坛,用户通过留言进行沟通,由于刚开始论坛里都是熟人,几乎都不需要对留言的内容作出审核,接收留言的页面可以是这样: class SaveMsg(){ private $msg; public funct

深入理解JavaScript系列(29):设计模式之装饰者模式详解

 这篇文章主要介绍了深入理解JavaScript系列(29):设计模式之装饰者模式详解,装饰者用用于包装同接口的对象,不仅允许你向方法添加行为,而且还可以将方法设置成原始对象调用(例如装饰者的构造函数),需要的朋友可以参考下     介绍 装饰者提供比继承更有弹性的替代方案. 装饰者用用于包装同接口的对象,不仅允许你向方法添加行为,而且还可以将方法设置成原始对象调用(例如装饰者的构造函数). 装饰者用于通过重载方法的形式添加新功能,该模式可以在被装饰者前面或者后面加上自己的行为以达到特定的目的.

学习JavaScript设计模式之装饰者模式_javascript技巧

有时我们不希望某个类天生就非常庞大,一次性包含许多职责.那么我们就可以使用装饰着模式. 装饰着模式可以动态地给某个对象添加一些额外的职责,从而不影响这个类中派生的其他对象. 装饰着模式将一个对象嵌入另一个对象之中,实际上相当于这个对象被另一个对象包装起来,形成一条包装链. 一.不改动原函数的情况下,给该函数添加些额外的功能 1. 保存原引用 window.onload = function() { console.log(1); }; var _onload = window.onload ||

轻松掌握JavaScript装饰者模式_javascript技巧

在传统的面向对象语言中,给对象添加功能常常使用继承的方式,但继承的方式会带来问题:当父类改变时,他的所有子类都将随之改变.  当JavaScript脚本运行时,在一个对象中(或他的原型上)增加行为会影响该对象的所有实例,  装饰者是一种实现继承的替代方案,它通过重载方法的形式添加新功能,该模式可以在被装饰者前面(before)或者后面(after)加上自己的行为以达到特定的目的.  装饰者模式是为已有功能动态地添加更多功能的一种方式,把每个要装饰的功能放在单独的函数里,然后用该函数包装所要装饰的

JavaScript中的装饰者模式详解

一. 装饰者模式的定义 装饰者模式的定义:动态地给一个对象添加额外的职责,而不会影响从这个类派生的其他对象. 二. 装饰者模式的实现 装饰者模式能够在不改变对象自身的基础上,在程序运行期间给对象动态添加职责. 在JavaScript的实际实现中,可以将本体对象放到装饰者对象中,这些对象以一条链的方式进行引用,形成一个聚合对象.本体对象和装饰者对象都拥有相同的接口,当请求到达链中的装饰者对象,这个装饰者对象会执行自身,随后将请求转发给本体对象. 2.1 通过对象覆写来实现装饰者模式 代码如下: /

JavaScript设计模式之装饰者模式介绍_javascript技巧

装饰者模式说明 说明:通一个类来动态的对另一个类的功能对象进行前或后的修饰,给它辅加一些额外的功能; 这是对一个类对象功能的装饰,装饰的类跟被装饰的类,要求拥有相同的访问接口方法(功能),这在动态面向对象类里,一般以实现同一个接口(interface)来约束实现:装饰类的要有对被装饰类的引用,用于在装饰类的相应方法,调用相应被装饰类的方法,然后对其进行修饰: 场景举例: 1>. 比如我们生活中的穿衣服, 一件衬衣,一件西装外套,一条裤子,一条领带,一双漂亮的皮鞋; 每多穿一件,都是对前面一件或全

ES7 decorator 装饰者模式

1.装饰模式 设计模式大家都有了解,网上有很多系列教程,比如 JS设计模式等等. 这里只分享 装饰者模式 以及在 如何使用 ES7 的 decorator 概念 1.1.装饰模式 v.s. 适配器模式 装饰模式和适配器模式都是"包装模式"(Wrapper Pattern),它们都是通过封装其他对象达到设计的目的的,但是它们的形态有很大区别. 适配器模式我们使用的场景比较多,比如连接不同数据库的情况,你需要包装现有的模块接口,从而使之适配数据库 -- 好比你手机使用转接口来适配插座那样:

设计模式学习:装饰者模式

装饰者(Decorator)模式又叫包装模式,用组合的方式来拓展对象的功能,是继承关系的一个替代方案. 定义说明:装饰者模式动态地将责任附加到对象上,若要扩展功能,装饰着提供了比继承更富有弹性的替代方案. 从实例中体会: 实例来自 HeadFirst一书(建议读该书,例子太赞了),是星巴克的例子.星巴克的咖啡很有名(穷学生,现在喝不起o(╯□╰)o).他们供应很多种类的咖啡.一开始他们的类设计是下面这样的. 但是因为购买咖啡的时候,会加入更重调料,比如:蒸奶(Steamed Milk),豆浆(S

PHP设计模式之装饰器模式

装饰器设计模式适用于下列工作场合: 需求变化是快速和细小的,而且几乎不影响应用程序的其他部分.() 使用装饰器设计模式设计类的目标是: 不必重写任何已有的功能性代码,而是对某个基于对象应用增量变化. 装饰器设计模式采用这样的构建方式: 在主代码流中应该能够直接插入一个或多个更改或"装饰"目标对象的装饰器,同时不影响其他代码流. <?php        class CD {            public $trackList;