JS设计模式之装饰者模式

原创 2016年05月31日 12:03:51

介绍

装饰者模式用于包装同接口的对象,不仅允许你向方法添加行为,而且还可以将方法设置成原始对象调用(例如装饰者的构造函数)。

装饰者模式通过重载方法的形式添加新功能,该模式可以在被装饰者前面或者后面加上自己的行为以达到特定的目的。

装饰者模式是比继承更有弹性的替代方案。

正文

装饰者模式究竟是个什么样子,还是代码中见:

//需要装饰的类(函数)
var tree = {};

//原始装饰
tree.decorate = function () {
    console.log('Make sure the tree won\'t fall');
};

//装饰方法
tree.getDecorator = function (deco) {
    tree[deco].prototype = this;
    return new tree[deco];
};

//装饰模式1
tree.RedBalls = function () {
    this.decorate = function () {
        this.RedBalls.prototype.decorate(); // 第7步:先执行原型(这时候是Angel了)的decorate方法
        console.log('Put on some red balls'); // 第8步 再输出 red
        // 将这2步作为RedBalls的decorate方法
    }
};

//装饰模式2
tree.BlueBalls = function () {
    this.decorate = function () {
        this.BlueBalls.prototype.decorate(); // 第1步:先执行原型的decorate方法,也就是tree.decorate()
        console.log('Add blue balls'); // 第2步 再输出blue
        // 将这2步作为BlueBalls的decorate方法
    }
};

//装饰模式3
tree.Angel = function () {
    this.decorate = function () {
        this.Angel.prototype.decorate(); // 第4步:先执行原型(这时候是BlueBalls了)的decorate方法
        console.log('An angel on the top'); // 第5步 再输出angel
        // 将这2步作为Angel的decorate方法
    }
};

//执行装饰
tree = tree.getDecorator('BlueBalls'); // 第3步:将BlueBalls对象赋给tree,这时候父原型里的getDecorator依然可用
tree = tree.getDecorator('Angel'); // 第6步:将Angel对象赋给tree,这时候父原型的父原型里的getDecorator依然可用
tree = tree.getDecorator('RedBalls'); // 第9步:将RedBalls对象赋给tree

tree.decorate(); // 第10步:执行RedBalls对象的decorate方法

总结

装饰者模式是为已有功能动态地添加更多功能的一种方式,把每个要装饰的功能放在单独的函数里,然后用该函数包装所要装饰的已有函数对象,因此,当需要执行特殊行为的时候,调用代码就可以根据需要有选择地、按顺序地使用装饰功能来包装对象。优点是把类(函数)的核心职责和装饰功能区分开了。

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

设计模式-装饰者

  • 2015年11月07日 10:44
  • 4.44MB
  • 下载

设计模式之装饰者(Decorator)

  • 2007年09月27日 14:38
  • 316KB
  • 下载

设计模式 - 装饰者

...

设计模式的装饰者模式的例子

  • 2011年12月21日 10:58
  • 3KB
  • 下载

Java设计模式之 —— 装饰者(Decorator) — 点炒饭

Java设计模式之 —— 装饰者(Decorator) — 做炒饭下面会用做炒饭的例子来描述一下装饰者设计模式,装饰者设计模式比较适合用于拓展功能,我要做炒饭,最简单的就是油盐加米饭就可以做出炒饭,但...

云南大学设计模式装饰者模式

  • 2017年11月13日 14:32
  • 6KB
  • 下载

设计模式—装饰者模式

  • 2016年01月04日 22:28
  • 478KB
  • 下载

JavaSE(16)(装饰者设计模式)

装饰者设计模式: package zz.itheima.decorator;public class DecoratorPattern { public static void main(Str...

设计模式装饰者模式

  • 2014年12月03日 16:41
  • 3KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JS设计模式之装饰者模式
举报原因:
原因补充:

(最多只允许输入30个字)