(精华)2020年6月25日 JavaScript高级篇 设计模式-代理模式

保护代理

<script>
    //主体，发送
    function sendMsg(msg) {
        console.log(msg);
    }
    //代理
    function proxySend(msg) {
        msg = msg.replace(/XT/, '');
        sendMsg(msg);
    }
    proxySend('XT，辛苦的码农')
</script>

虚拟代理

<!-- scroll, resize,keyup 等事件频繁触发会引起卡顿 -->
function scrollHnader(name,age){
    console.log('屏幕滚动了');
}
function debounce2(fn,delay){
    delay = delay || 300;
    if(fn.id){
        clearTimeout(fn.id);
    }
    fn.id = setTimeout(function(){          
        fn();
     },delay);
}
window.onscroll = function(){
    debounce2(scrollHnader.bind(this,'laney'),500); 
}

缓存代理

function add(){
    var arg = Array.from(arguments); //es6
     return arg.reduce(function(a,b){
          return a+b;
     })
}

var proxyAdd = (function(){
    var cache = [];
    return function(){
        var arg = Array.from(arguments).join(','); 
        if(cache[arg]){
            return cache[arg];
        } else {
            var ret=  add.apply(this,arguments);
            cache[arg] = ret;
            return ret;
        }
    }
})();

var k1= proxyAdd(1,2,3,4)
proxyAdd(10,20,30,40)
proxyAdd(10,20,30,40)//取缓存
proxyAdd(10,20,30,40)//取缓存