51工具盒子

依楼听风雨
笑看云卷云舒,淡观潮起潮落

JS设计模式之装饰器模式

意图 {#意图}

动态地给一个对象添加一些额外的职责。就增加功能来说,装饰器模式相比生成子类更为灵活。

------《设计模式:可复用面向对象软件的基础》中文版第132页

在Java中这样的设计可太多了,比如进行IO操作时的XxxReader,那么这里就模仿它进行一个应用。

示例 {#示例}

如下:

|------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | class NumberReader { constructor(start) { this.pos = start } read() { return this.pos++ } } class DoubleReader { constructor(reader) { this.reader = reader } read() { return this.reader.read() * 2 } } class CharReader { constructor(reader) { this.reader = reader } read() { const code = 'a'.charCodeAt(0) + this.reader.read() return String.fromCharCode(code) } } class UpperCharReader { constructor(reader) { this.reader = reader } read() { return this.reader.read().toUpperCase() } } const reader = new UpperCharReader( new CharReader( new DoubleReader( new NumberReader(5) ) ) ) console.log(reader.read()) // K console.log(reader.read()) // M |

我们来分析一下执行过程:

  1. NumberReader.prototype.read()被调用,返回5
  2. DoubleReader.prototype.read()被调用,返回5*2=10
  3. CharReader.prototype.read()被调用,返回字母'a'后第10个字母'k'
  4. UpperCharReader.prototype.read()被调用,返回'k'.toUpperCase()'K'

第二个reader.read()同理。这就是一种经典的应用了,不过这是Java里常见的用法,JS里我还不太清楚。

参考 {#参考}

设计模式:可复用面向对象软件的基础

赞(1)
未经允许不得转载:工具盒子 » JS设计模式之装饰器模式