『面试的底气』—— 设计模式之装饰者模式（一）

前端大骆
1,714 阅读3分钟

定义

给对象动态地增加职责的方式称为装饰者模式，装饰者模式能够在不改变对象自身的基础上，在程序运行期间给对象动态地添加职责。跟继承相比，装饰者是一种更轻便灵活的做法，这是一种“即用即付”的方式，好比天冷了就多穿一件外套。

用类来实现装饰者模式

在类中很少使用装饰者模式，因为使用继承也是可以改变类的。但是还是介绍一下，或许有作用。用一个例子来介绍。

比如把一个q当作一个原始类，给这只q强化一下，即可以发出散d也可以发出普通子d。在不改变原始类和不用继承的的情况下，可以用装饰者模式来实现。

class Gun{
  constructor(){
  }
  fire(){
    console.log('发普通子d')
  }
}
class ShrapnelGun{
  constructor(gun){
    this.gun = gun;
  }
  fire(){
    this.gun.fire();
    console.log( '发散d' );
  }
}

const gun = new Gun();
const shrapnelGun = new ShrapnelGun(gun);
shrapnelGun.fire(); // 发普通子d 发散d

散dq类ShrapnelGun接收普通q类Gun生成的对象，并存储在this.gun，在散弹q类ShrapnelGun的开抢fire调用普通q类Gun的开qfire的方法，也可以执行自己的逻辑，发射出散dq。散dq类ShrapnelGun相当把普通q类Gun装饰了一下。

这种给对象动态增加职责的方式，并没有真正地改动对象自身，而是将对象放入另一个对象之中，这些对象以一条链的方式进行引用，形成一个聚合对象。这些对象都拥有相同的接口（fire方法），当请求达到链中的某个对象时，这个对象会执行自身的操作，随后把请求转发给链中的下一个对象。

因为装饰者对象和它所装饰的对象拥有一致的接口，所以它们对使用该对象的客户来说是透明的，被装饰的对象也并不需要了解它曾经被装饰过，这种透明性使得我们可以递归地嵌套任意多个装饰者对象。比如在给散dq强化一下，可以发出爆裂d。可以这么实现：

class Gun{
  constructor(){
  }
  fire(){
    console.log('发普通子d')
  }
}
class ShrapnelGun{
  constructor(gun){
    this.gun = gun;
  }
  fire(){
    this.gun.fire();
    console.log( '发散d' );
  }
}

class BurstGun{
  constructor(gun){
    this.gun = gun;
  }
  fire(){
    this.gun.fire();
    console.log( '发爆裂d' );
  }
}

const gun = new Gun();
const shrapnelGun = new ShrapnelGun(gun);
const burstGun = new BurstGun(shrapnelGun);
shrapnelGun.fire(); // 发普通子d 发散d 发爆裂d

装饰者模式将一个对象嵌入另一个对象之中，实际上相当于这个对象被另一个对象包装起来，形成一条包装链。请求随着这条链依次传递到所有的对象，每个对象都有处理这条请求的机会。

不使用类来实现装饰者模式

在JavaScript中可以直接改写对象或者对象的某个方法，并不需要使用“类”来实现装饰者模式，代码如下：

const gun = {
  fire: function () {
    console.log('发普通子d');
  }
}
const shrapnelGun = function () {
  console.log('发导d');
}
const burstGun = function () {
  console.log('发原子d');
}
const fire1 = gun.fire;
gun.fire = function () {
  fire1();
  shrapnelGun();
}
const fire2 = gun.fire;
plane.fire = function () {
  fire2();
  burstGun();
}
gun.fire();//发普通子d、发散d、发爆裂d

上面只是针对对象来实现装饰者模式，实现在不改变自身对象的基础上给对象新增功能，那针对函数呢？函数在JavaScript中函数又被称为一等对象。

在JavaScript中可以很方便地给某个对象扩展属性和方法，但却很难在不改动某个函数源代码的情况下，给该函数添加一些额外的功能，最简单粗暴的方式就是直接改写该函数，但这是最差的办法，直接违反了开放-封闭原则，而利用装饰者模式可以解决这类问题，具体如何解决，将会在下篇文章中介绍。

avatar
文章
阅读
粉丝