这次给大家带来javascript的代理模式，javascript代理模式的注意事项有哪些，下面就是实战案例，一起来看一下。
代理模式的定义：为其他对象提供一种代理以控制对这个对象的访问。在某些情况下，一个对象不适合或者不能直接引用另一个对象，而代理对象可以在客户端和目标对象之间起到中介的作用。
虚拟代理是把一些开销很大的对象，延迟到真正需要它的时候才去创建执行
图片懒加载
//图片加载let imageele = (function(){ let node = document.createelement('img'); document.body.appendchild(node); return { setsrc:function(src){
node.src = src;
}
}
})();//代理对象let proxy = (function(){ let img = new image();
img.onload = function(){
imageele.setsrc(this.src);
}; return { setsrc:function(src){
img.src = src;
imageele.setsrc('loading.gif');
}
}
})();
proxy.setsrc('example.png');
合并http请求
如果有一个功能需要频繁进行请求操作，这样开销比较大，可以通过一个代理函数收集一段时间内请求数据，一次性发出
//上传请求let upload = function(ids){
$.ajax({ data: { id:ids
}
})
}//代理合并请求let proxy = (function(){ let cache = [],
timer = null; return function(id){
cache[cache.length] = id; if(timer) return false;
timer = settimeout(function(){
upload(cache.join(','));
cleartimeout(timer);
timer = null;
cache = [];
},2000);
}
})();
// 绑定点击事件let checkbox = document.getelementsbytagname( "input" );for(var i= 0, c; c = checkbox[i++];){
c.onclick = function(){ if(this.checked === true){
proxy(this.id);
}
}
}
缓存代理
缓存代理可以作为一些开销大的运算结果提供暂时的存储，下次运算时，如果传递进来的参数跟之前一致，则可以直接返回前面存储的运算结果
//计算乘积let mult = function(){ let result = 1; for(let i = 0,len = arguments.length;i < len;i++){
result*= arguments[i];
} return result;
}//缓存代理let proxy = (function(){ let cache = {};
reutrn function(){ let args = array.prototype.join.call(arguments,','); if(args in cache){ return cache[args];
} return cache[args] = mult.apply(this,arguments);
}
})();
优缺点
优点：代理模式能将代理对象与被调用对象分离，降低了系统的耦合度。代理模式在客户端和目标对象之间起到一个中介作用，这样可以起到保护目标对象的作用。代理对象也可以对目标对象调用之前进行其他操作。
缺点：增加了系统的复杂度
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
javascript的策略模式
js的函数节流使用
以上就是javascript的代理模式的详细内容。