代理模式
2018-12-11 本文已影响0人
会飞小超人
代理的意义
面向对象设计有一个重要的原则--单一职责原则。
单一职责原则指的是，就一个类（通常也包括对象和函数等）而言，应该仅有一个引起它变化的原因。如果一个对象承担了多项职责，就意味着这个对象将变得巨大，引起它变化的原因可能会有多个。面向对象设计鼓励将行为分布到细粒度的对象之中，如果一个对象承担的指责过多，等于把这些职责耦合到了一起，这种耦合会导致脆弱和低内聚的设计。当变化发生时，设计可能会遭到意外的破坏。
代理和本体接口的一致性
保证代理和本地接口的一致性，这样调用者就不用关心代理和本体的区别，这样有两个好处。
- 用户可以放心的请求代理，他只关心是否能得到想要的结果。
- 在任何使用本体的地方都可以替换成使用代理。
虚拟代理合并http请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<input type="checkbox" id="1"></input>1
<input type="checkbox" id="2"></input>2
<input type="checkbox" id="3"></input>3
<input type="checkbox" id="4"></input>4
<input type="checkbox" id="5"></input>5
<input type="checkbox" id="6"></input>6
<input type="checkbox" id="7"></input>7
<input type="checkbox" id="8"></input>8
<input type="checkbox" id="9"></input>9
<script>
/* 虚拟代理实现合并http请求 */
// 同步文件函数
const syncFile=function(id){
console.log('同步文件，id:'+id)
}
// 同步文件代理函数
const proxySyncFile=(function(){
let cache=[]
let timer
return function(id){
cache.push(id)
if(timer){
return
}
timer=setTimeout(function(){
syncFile(cache.join(','))
clearTimeout(timer)
timer=null
cache=[]
},2000)
}
})()
let checkbox = document.getElementsByTagName( 'input' );
for(let i=0,c;c=checkbox[i++];){
c.onclick=function(){
if(this.checked){
proxySyncFile(this.id)
}
}
}
</script>
</body>
</html>
缓存代理
const createCacheProxyFactory=function(func){
let cache={}
return function(){
let args=Array.prototype.join.call(arguments,',')
if(args in cache){
return cache[args]
}
return cache[args]=func.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
}
proxyMult=createCacheProxyFactory(mult)
console.log(proxyMult(1,2,3,4,5)) // 120
console.log(proxyMult(1,2,3,4,5)) // 不用重新计算，直接从缓存中读出120
