装饰器模式（面试版）

一、面试常考点

1. 装饰器模式解决什么问题

在不改原对象代码的前提下，动态增强对象能力。

2. 与继承的差异

继承是静态扩展；装饰器是运行时按需组合，更灵活。

3. 常见追问

装饰器与代理区别、装饰顺序是否影响结果。

二、细节介绍

1. 核心思想

通过“包裹对象”叠加行为，每一层只关注单一增强职责。

2. 优点

扩展性强，避免子类爆炸，符合开闭原则。

3. 代价

层级过深会增加调试复杂度。

三、示例代码

class Coffee {
  cost() {
    return 10
  }
  desc() {
    return 'Coffee'
  }
}

function milkDecorator(target) {
  return {
    cost: () => target.cost() + 3,
    desc: () => `${target.desc()} + Milk`,
  }
}

function sugarDecorator(target) {
  return {
    cost: () => target.cost() + 1,
    desc: () => `${target.desc()} + Sugar`,
  }
}

let order = new Coffee()
order = milkDecorator(order)
order = sugarDecorator(order)
console.log(order.desc(), order.cost())

四、常用应用场景

1. 前端埋点增强

在原函数执行前后注入埋点。

2. 请求增强

给请求对象动态加鉴权、重试、超时控制。

3. UI 能力叠加

给组件按需叠加 loading、权限、主题能力。

五、高频追问标准答法（Q/A）

1. Q: 装饰器和代理一句话区别

A: 装饰器偏功能增强；代理偏访问控制。

2. Q: 装饰器最大的工程风险

A: 增强链过长导致行为不可预测和定位困难。