设计模式－－代理模式

发表于

代理模式分类

  1. 保护代理
    控制不同权限对象对目标对象对访问。
  2. 虚拟代理
    把一些开销很大对对象延迟到真正需要他对时候才去创建。下面用虚拟代理实现图片预加载：
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    var myImage=(function() {
      var imgNode=document.createNode('img');
      document.body.appendChild(imgNode);
      
      return {
          setSrc: function(src) {
            imgNode.src=src;
          }
      }
    })()
    var proxyImage=(function() {
      var img=new Image;
      img.onload=function() {
        myImage.setSrc(this.src);
      }
      return {
          setSrc: function(src) {
            myImage.setSrc('file://loading.jpg');
            img.src=src;
          }
      }
    })()
    proxyImage.setSrc('src.jpg');

设计原则

  1. 用户可以放心的请求代理，只关心能否得到想要的结果。
  2. 在任何使用本体的地方都可以替换成使用代理。

缓存代理

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
//用代理模式实现缓存
//先实现一个目标函数 这里是求阶乘
var mult=function() {
  console.log('开始计算阶乘');
  var a=1;
  for (var i=0,cur=arguments[i];i<arguments.length;i++) {
      a=a*cur;
  }
  console.log('输出：',a);
  return a;
}
//缓存结果的代理 调用代理即可
var proxyMult=(function() {
  var cache={};
  return function() {
    var args=Array.prototype.join.call(arguments,',');
    if (args in cache) {
        console.log('输出：',cache[args]);
        return cache[args];
    }
    return (cache[args]=mult.apply(this,arguments));
  }
})()
//这里我们可以更进一步，创建一个 缓存代理的工厂,就可以接受不同的运算规则了
var createProxyfactory=function(fn) {
  var cache={};
  return function() {
    var args=Array.prototype.join.call(arguments,',');
    if (args in cache) {
        return cache[args];
    }
    return cache[args]=fn.apply(this,arguments);
  }
}