什么是装饰者模式?

装饰者模式,其中的重点自然就在“装饰”这两个字上面,在日常生活中很多东西都是需要装饰的,装饰的目的是为了原来的物品更加的好看,或者是加个装饰让物品更加实用,装饰一般都能够为原来的物品添加一些新的功能,而添加的装饰在添加新的功能的时候也不会改变原来的物品。

那么在编程中的装饰其实和生活之中的装饰也是一个道理。所以装饰者模式的一个基本的原则就是在不改变对象自身的基础上,在程序运行期间给对象动态的添加职责,能够使得功能变得可插拔更加的灵活。

模拟传统面向对象语言的装饰者模式

下面通过一个简单的例子来体会一下装饰者模式:

假设现在我们在编写一个飞机大战的游戏,随着等级的上升我们的飞机功能不断的增强,一开始只能发射子弹,二级之后可以发射导弹了,三级之后可以发送原子弹了。

首先实现一个飞机类:

var Plane = function () {}
Plane.prototype.fire = function () {
    console.log('发射普通子弹')
}

接下来添加两个装饰类,分别实现发射原子弹和导弹:

var MissileDecorator = function (plane) {
    this.plane = plane
}
MissileDecorator.prototype.fire = function () {
    this.plane.fire()
    console.log('发射导弹')
}
var AtomDecorator = function (plane) {
    this.plane = plane
}
AtomDecorator.prototype.fire = function () {
    this.plane.fire()
    console.log('发射原子弹')
}

导弹类和原子弹类的构造函数都接受参数plane对象,并且保留这个参数,在执行他们自身的操作之外还执行plane的fire方法。

这样子每被装饰一次之后原来的类就新增了一个功能,而且原始的类也没有被改变。

使用:

var plane = new Plane();
plane = new MissileDecorator( plane );
plane = new AtomDecorator( plane );
plane.fire();
// 分别输出: 发射普通子弹、发射导弹、发射原子弹

装饰者也是包装容器

从上面的例子可以看到,每经过一次装饰就相当于在原来的类外部包装了一层对象,形成了一条包装链,请求随着这条包装链依次传递到所有的对象,每个对象都会有机会来处理这个请求。

【完】

作者简介:李成文,芦苇科技web前端实习生,公司部分作品:口红挑战网红小游戏、服务端渲染官网。擅长网站建设、公众号开发、微信小程序开发、小游戏、公众号开发,专注于前端领域框架、交互设计、图像绘制、数据分析等研究。 访问 www.talkmoney.cn 了解更多


广州芦苇科技前端
62 声望7 粉丝

广州芦苇信息科技有限公司 - web前端开发,学习沉淀,技术积累,技术探索