设计模式-代理模式

简介

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,开发者可以非常方便地实现复杂的拦截逻辑和行为控制

相关推荐
进击的前栈14 小时前
鸿蒙实战:19 页面全景汇总与 7 大共享设计模式回顾
华为·设计模式·harmonyos
刀法如飞14 小时前
Spring Boot 4.1 + JDK 25 DDD开源脚手架,面向 AI 编程
设计模式·架构·ai编程
折哥的程序人生 · 物流技术专研14 小时前
第8篇:模板方法模式的优缺点与面试高频考点
java·设计模式·面试·模板方法模式·行为型模式·优缺点·扩充系列
workflower15 小时前
人形机器人全身运动控制能力大幅提升
人工智能·深度学习·机器学习·设计模式·机器人·自动化
折哥的程序人生 · 物流技术专研15 小时前
Java 23 种设计模式:从踩坑到精通 | 备忘录模式 —— 快照与撤销,给对象装一个“后悔药”
java·设计模式·备忘录模式·行为型模式·java设计模式·从踩坑到精通·撤销重做
Kel16 小时前
万物皆 Runnable:LangChain 如何用一个接口统一模型、链与图
人工智能·设计模式·架构
ttod_qzstudio19 小时前
【软考设计模式】策略模式:算法族的封装与动态切换精讲
设计模式·策略模式
咖啡八杯1 天前
GoF设计模式——迭代器模式
java·后端·设计模式·迭代器模式
ttod_qzstudio1 天前
【软考设计模式】外观模式:复杂子系统的“门面“封装与代码填空精讲
设计模式·外观模式
geovindu1 天前
CSharp: Prototype Pattern
开发语言·后端·设计模式·.net·原型模式·创建型模式