设计模式-代理模式

简介

JavaScript 中,代理模式是一种结构型设计模式,它为其他对象提供一个代理或占位符以控制对这个对象的访问。这种模式是用来创建具有代理功能的对象的,使得客户无需修改代码就能使用代理对象来间接访问某个对象。使用代理模式可以实现多种功能,如安全控制、延迟初始化、网络请求、日志记录

代理模式的优点

  • 隔离性:通过代理可以隐藏对象的真实复杂性。
  • 开闭原则:可以在不修改原始对象的情况下,通过引入代理对象来扩展功能。
  • 控制访问:可以控制客户对对象的访问。

代理模式的常见类型

  • 虚拟代理:延迟对象的创建直到真正需要时。
  • 保护代理:控制对原始对象的访问,常用于权限控制。
  • 智能引用代理:在对象被访问时执行额外的动作,如引用计数和线程安全检查。
  • 缓存代理:为开销大的运算结果提供临时存储,以便多次请求间共享结果。
  • 远程代理:为一个位于不同地址空间的对象提供一个本地的代表对象。

代理模式实现

在 JavaScript 中,代理模式可以通过简单的对象组合来实现,也可以使用 ES6 提供的 Proxy 类来实现更强大和灵活的代理功能

1. 使用对象组合实现简单的保护代理

假设我们有一个用户信息对象,我们不希望直接让外部代码修改用户的年龄。

javascript 复制代码
function Person(name, age) {
    this.name = name;
    this.age = age;
}

const person = new Person("John Doe", 25);

const personProxy = {
    setName(name) {
        console.log('Updating name...');
        person.name = name;
    },
    setAge(age) {
        if (age < 0 || age > 120) {
            console.log("Invalid age");
        } else {
            console.log('Updating age...');
            person.age = age;
        }
    },
    getName() {
        return person.name;
    },
    getAge() {
        return person.age;
    }
};

personProxy.setAge(30); // 正常更新
personProxy.setAge(-1); // 输出 "Invalid age"

console.log(personProxy.getAge()); // 30

2.使用 ES6 Proxy 实现更灵活的拦截

ES6 引入的 Proxy 对象允许你创建一个对象的代理,从而提供对基本操作的自定义行为(属性查找、赋值、枚举、函数调用等)。

javascript 复制代码
let target = {
    name: "John Doe",
    age: 25
};

let handler = {
    get: function (obj, prop) {
        if (prop in obj) {
            console.log(`Getting ${prop}: ${obj[prop]}`);
            return obj[prop];
        } else {
            return "Property does not exist";
        }
    },
    set: function (obj, prop, value) {
        if (prop === 'age' && (value < 0 || value > 120)) {
            console.log("Invalid age");
        } else {
            console.log(`Setting ${prop} to ${value}`);
            obj[prop] = value;
        }
        return true;
    }
};

const proxy = new Proxy(target, handler);

proxy.age = 30;
console.log(proxy.age); // 30
proxy.age = -1; // "Invalid age"

在这个例子中,Proxy 对象 proxy 被用来控制对 target 对象的访问。通过 handler 对象定义了对属性的访问和设置的自定义行为

总结

代理模式在 JavaScript 中是非常有用的,特别是在现代前端框架和 Node.js 中。它提供了一个强大的方式来增强程序的灵活性,加强对对象的访问控制。通过使用 ES6 的 Proxy,开发者可以非常方便地实现复杂的拦截逻辑和行为控制

相关推荐
杨充19 小时前
10.可测试性实战设计
设计模式·开源·代码规范
杨充20 小时前
9.重构十二式的实战
设计模式·开源·代码规范
杨充20 小时前
6.设计原则的全景图
设计模式·开源·全栈
杨充20 小时前
2.面向对象的特性
设计模式
杨充20 小时前
7.SOLID原则案例汇
设计模式·开源·全栈
杨充20 小时前
8.反模式与坏味道
设计模式·开源·代码规范
杨充20 小时前
3.接口vs抽象类比较
设计模式
咖啡八杯1 天前
文法、BNF与AST
java·设计模式·解释器模式·ast·文法
咖啡八杯1 天前
GoF设计模式——解释器模式
java·后端·spring·设计模式