设计模式-javascript实现【代理模式】
定义: 代理模式是为一个对象提供一个代用品或占位符,以便控制对它的访问。
1. 代理模式的实现
const Flower = function(){};
const xiaoming = {
sendFlower: function(target){
const flower = new Flower();
target.receiveFlower(flower);
}
};
const B = {
receiveFlower: function(flower) {
A.listenGoodMood(function(){
A.receiveFlower(flower);
});
}
};
const A = {
receiveFlower: function(flower){
console.log('receive the ' + flower);
},
listenGoodMood: function(fn) {
setTimeout(function(){
fn();
}, 2000);
}
};
xiaoming.sendFlower(B);
2. 虚拟代理实现图片愈加载
虚拟代理把一些开销很大的对象,延迟到真正需要它的时候才去创建。
const myImage = (function(){
const imageNode = document.createElement('img');
document.body.appendChild(imgNode);
return {
setSrc: function(src){
imgNode.src = src;
}
};
})();
const proxyImage = (function(){
const img = new Image;
img.onload = function(){
myImage.setSrc(this.src);
}
return {
setSrc: function(src){
myImage.setSrc('file://C:/Users/svenzeng/Desktop/loading.gif');
img.src = src;
}
};
})();
proxyImage.setSrc('http://imgcache.qq.com/music/photo/k/000GGDys0yA0Nk.jpg');
3. 用高阶函数实现创建缓存代理
缓存代理可以为一些开销大的运算结果提供暂时的存储,在下次运算时,如果传递进来的参数跟之前一致,则
可以直接返回前面存储的运算结果。
const createProxyFactory = function(fn){
const cache = {};
return function(){
const args = Array.prototype.join.call(arguments, ',');
if( args in cache ){
return cache[args];
}
return cache[args] = fn.apply(this, arguments);
};
};
const mult = function(){
let a = 1;
for (let i = 0, l = arguments.length; i< l; i++){
a = a * arguments[i];
}
return a;
};
const proxyMult = createProxyFactory(mult);
console.log(proxyMult(1, 2, 3, 4)); // 24
标签:
javascript
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
2022-03-21 shell编程 - sed编辑器