关于前端:6设计模式之代理模式

代理模式：为其余对象提供一种代理以管制对这个对象的拜访

当我第一次看到代理模式的定义是，脑海中浮现的一句代码就是 const that = this;，咱们通过that 来代理 this 的拜访，尽管没有体现 管制 的象征，但体现了 代理 的意思。

在日常的开发工作之中，我对于代理模式的了解是：对对象的操作增加过滤的伎俩。

之前在工作中遇到一个场景：平台管理系统须要去保护各子系统的公共数据（CommonData），各子系统在应用时去拉取公共数据，然而这样拉取公共数据其实会是比拟大的开销，因为公共数据的变动比拟迟缓，时效性比拟低，咱们能够通过代理拉取公共数据的函数来操作。代码如下：

// 拉取公共数据函数
const getCommonData = async (type) => {
return await Ajax(type);
};
​
// 代理函数
const CommonDataMap = new Map();
const getCommonDataProxy = async (type) => {
let data = CommonDataMap.get(type);
if (!data) {
data = await getCommonData(type);
CommonDataMap.set(type, data);
}
​
return data;
};

应用场景

1. 近程代理：为一个对象在不同的地址空间提供部分代表，这样能够暗藏一个对象存在不同地址空间的事实
2. 虚构代理：依据须要创立开销很大的对象，通过它来寄存实例化须要很长时间的实在对象
3. 平安代理：用来管制，实在对象拜访时的权限
4. 智能指引：值当调用实在的对象时，代理解决另外一些事件

我的教训

在前端中，我遇到或应用代理模式的场景有：

• 须要对某些类、办法的应用做一层过滤
• 须要监听某些类、办法的应用并做解决
• 某些 DOM 懒加载的状况（比方图片懒加载）
• • *

参考

大话设计模式 — 程杰

集体博客

北落师门