本文共 2045 字，大约阅读时间需要 6 分钟。

代理模式的理解

代理模式（Proxy Pattern）是一种设计模式，用于为其他对象提供一种代理以控制对象的访问。这种模式常用于隔离对象，避免直接访问目标对象，同时通过代理来进行授权和控制。

代理模式的特点

• 使用者无权访问目标对象：代理模式通过中间代理实现对目标对象的访问控制，确保使用者无法直接操作目标对象。
• 中间加代理，通过代理做授权和控制：代理类在与目标对象交互时，执行必要的权限检查和操作控制，确保所有操作符合业务逻辑。

代理模式的典型场景

购票系统中的黄牛代理

在买火车票的过程中，黄牛相当于我们本人的代理。通过黄牛购买票，我们可以避免与火车站的直接交互，省去很多繁琐的步骤，同时还能享受到黄牛提供的更好的服务（前提是支付金额足够）。

网页事件代理

在前端开发中，网页事件代理是一种常见的模式。通过事件代理，我们可以将多个子元素的事件处理逻辑集中到父元素上，减少代码冗余。例如，通过将事件代理到父元素，可以统一处理多个子元素的点击、鼠标过渡等事件。

jQuery代理

在 jQuery 中，.proxy() 方法可以用来代理函数的调用。这种方式特别适用于在 setTimeout 或其他异步操作中，无法直接访问外层 this 的场景。通过 jQuery 的代理方法，可以避免传递大量的函数参数，同时还能保持函数的灵活性。

ES6 Proxy 代理

ES6 引入了 Proxy 代理语法，提供了更简洁的代理实现方式。通过定义 getter 和 setter，可以对目标对象的属性和方法进行控制。例如，可以创建一个代理对象，限制某些属性的访问或设置特定的值。

代理模式的类图

传统类图

传统的代理模式通常表现为以下类图结构：

• Image 接口：顶层接口，定义了共有方法（如 display()）。
• RealImage 类：实现 Image 接口的实际图片类，负责加载和显示图片。
• ProxyImage 类：实现 Image 接口的代理类，负责对 RealImage 的操作进行授权和控制。

简化的 JavaScript 类图

在 JavaScript 中，代理类与被代理类的方法完全一致：

class Realimg {
  constructor(fileName) {
    this.fileName = fileName;
    this.load();
  }
  display() {
    console.log(`显示图片：${this.fileName}`);
  }
  load() {
    console.log(`正在加载：${this.fileName}`);
  }
}
class ProxyImg {
  constructor(fileName) {
    this.proxy = new Realimg(fileName);
  }
  display() {
    this.proxy.display();
  }
}
const proxyImg = new ProxyImg('libi.jpg');
proxyImg.display();

Proxy 代理的语法示例

const actor = {
  name: 'JkChen',
  phone: '12312312333',
  price: 1000
};
const agent = new Proxy(actor, {
  get(target, key) {
    if (key === 'phone') {
      return '经纪人电话：111111111111';
    }
    if (key === 'price') {
      return 2;
    }
    return target[key];
  },
  set(target, key, value) {
    if (key === 'setPrice' && value < 2) {
      console.log('价格不能低于 2 元');
    } else {
      target[key] = value;
      return true;
    }
  }
});
console.log(agent.name); // JkChen
console.log(agent.phone); // 经纪人电话：111111111111
console.log(agent.price); // 2 元
actor.setPrice = 1;

代理模式的优势

• 开放封闭原则：代理模式允许在不修改目标类的前提下，扩展和修改代理类的行为，符合开放封闭原则。
• 解耦：通过引入代理层，实现了对目标对象的解耦，使系统结构更加清晰，减少了耦合度。
• 灵活性：代理模式允许定义不同的代理逻辑，支持多种不同的代理行为，提高系统的灵活性。