设计模式学习之七-代理模式

发表于 |

代理模式的意义是: 坚持职责单一原则，每个功能方法只做那一件事。

应用场景

在web开发中，我们通常会遇到HTTP请求或者鼠标滚动这样的高触发频率事件，
于是就应用到了函数防抖。

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
const synchronousEvent = (id) => {
    console.log('开始执行自定义事件： ' + id);
}

const proxySynchronousEvnet = (() => {
    const cache = [];
    let timer = undefined;

    return (id) => {
        cache.push(id);

        if(timer) return;

        timer = setTimeout(() => {
            synchronousEvent(cache.join(','));
            clearTimeout(timer);
            timer = null;
            cache.length = 0;
        }, 2000);
    }
})();

window.onclick = (event) => {
    proxySynchronousEvent(event.timeStamp);
}

这里通过proxySynchronousEvent来代理事件,以2s为间隔，把2秒内的请求都统一来执行，职责单一的
体现是自定义事件始终是在synchronousEvent方法中，而proxySynchronousEvent才是真正负责
事件触发时机。