JavaScript设计模式 样例三 —— 装饰模式

装饰模式(Decorator Pattern):

定义:在不改变原对象的情况下,动态的给对象添加一些额外的职责。就功能而言,装饰模式相比生成子类更为灵活。
目的:把类的核心职责和装饰功能区分开。可以去除相关类中重复的逻辑。
场景:当系统需要扩展一个类的功能,或者客户端需要动态的给一个对象添加功能,并且使用继承或生成子类会很复杂的时候。
装饰模式体现了"多用组合,少用继承"这一设计原则。

例:JS代码实现

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
// 一辆小汽车 的构造函数
function ACar () {
    // 一辆原味小汽车的价格是 99 元
    this.price = function () {
        return 99
    }
}
 
// 装饰器 —— 汽车喇叭
function carTrumpet (car) {
    let price = car.price()
    car.trumpet = function () {
        console.log('滴 滴滴')
    }
    // 一个喇叭加价 10 元
    car.price = function () {
        return price + 10
    }
}
 
// 装饰器 —— 行车记录仪
function carRecorder (car) {
    let price = car.price()
    car.recorder = function () {
        console.log('让一让啊 让一让 我有行车记录仪')
    }
    // 一个行车记录仪加价 9.9 元
    car.price = function () {
        return price + 9.9
    }
}
 
// 初始化一辆小汽车
let car = new ACar()
// 给小汽车装上喇叭
carTrumpet(car)
// 给小汽车装上行车记录仪
carRecorder(car)
// 最后小汽车的价格是 118.9 元
console.log(car.price())

  

Git地址:https://github.com/skillnull/Design-Mode-Example

posted @   SKILL·NULL  阅读(167)  评论(0编辑  收藏  举报
编辑推荐:
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
点击右上角即可分享
微信分享提示