聊聊设计模式（4）：装饰模式 -- 编程语言 -- IT技术博客大学习 -- 共学习共进步！

您现在的位置：首页 --> 编程语言 --> 聊聊设计模式（4）：装饰模式

聊聊设计模式（4）：装饰模式

浏览:1490次出处信息

Decorator Pattern，中文名为装饰者模式，这个模式思想很简单，但是特别容易把代码搞复杂，它包含四个重要角色：

Component, 抽象构件
ConcreteComponent, 具体构件
Decorator, 抽象装饰类
ConcreteDecorator, 具体装饰类

这几个角色很容易把人搞懵，所以在使用这个模式之前要彻底理解它。ECMAScript 2017 中增加了修饰器，它从语法层面帮掩盖了 Decorator 装饰类和 Component 构件，极大程度方便了我们理解装饰器：

functionactivate(target) {
    target.barkable = true;
    target.runnable = true;
}
@activate
classEDog{}
console.log(EDog.barkable, EDog.runnable); // true true

上面的代码很简单，activate 是一个开关装饰类，通过它激活了 EDog —— 不会跑、不会叫的电子狗，让它具备了 bark 和 run 能力。

场景复现

过年回来后业务压力不大，小苏让小喜抽空做一个代码发布平台，帮助团队迁移代码发布平台，之前的前端静态代码是通过 SVN 管理和发布的，现在需要迁移到 Git 上去，小苏说这是个重任。小喜暗自欣喜，这 TM 也太简单了。

使用开源的 gitlab 搭建了一个代码管理平台，然后在 gitlab 上添加了钩子，每次有代码推送时，向小喜的代码平台发送一个请求，小喜便直接执行 publish 操作：

classCodePlatform{
    publish(gitInfo) {
this.scpCodeFromGitlabToOnline();
    }
// 直接将 gitlab 代码直接复制到线上机器
    scpCodeFromGitlabToOnline() {
// ...
    }
}

不久之后代码的构建从线下迁移到了线上，要求代码发布时先使用构建服务器处理，于是小喜给 CodePlatform 增加了一项功能：

classCodePlatform{
    publish() {
this.transferCodeToBuilderServer(() => {
this.scpCodeFromGitlabToOnline();
        });
    }
    scpCodeFromGitlabToOnline() {}
// 将代码扔到构建服务器
    transferCodeToBuilderServer() {}
}

随着团队工程化程度越来越高，很多线下操作流程渐渐搬移到了线上进行云处理，后续又增加了测试服务器、日志服务器、安全监测服务器等，结果小喜的代码变成了这样：

classCodePlatform{
    publish() {
// publish 的逻辑越来越重
    }
    scpCodeFromGitlabToOnline() {}
    transferCodeToBuilderServer() {}
    transferCodeToLogServer() {}
    transferCodeToSecureServer() {}
    transferCodeToTestServer() {}
}

小喜怎么也没想到，发布一个仓库在 CodePlatform 需要走这么多流程，这个类的职责越来越多，代码体积也越来越庞大，此时的小喜有点苦恼。

有一次，小喜学习 ES7 相关知识，突然看到一个叫做 Decorator 的东西，想了想似乎可以在项目中用一下。这不用不知道，一用吓一跳，原来之前的代码还可以这样架构：

// 为所有的服务添加日志服务
classLogService{}
const logger = new LogService();
@logger('build')
classBuildService{}
@logger('secure')
classSecureService{}
@logger('test')
classTestService{}

首先将服务抽离出来，然后：

const builder = new BuildService();
const securer = new SecureSevice();
const tester = new TestService();
@securer
@logger('CodePlatform')
classCodePlatform{
    @builder
    @tester
   publish() {}
}