『面试的底气』—— 设计模式之代理模式(二)｜8月更文挑战

“这是我参与8月更文挑战的第12天，活动详情查看：8月更文挑战”

前言

在面试高级前端时，往往会遇到一些关于设计模式的问题，每次都回答不太理想。恰逢8月更文挑战的活动，准备用一个月时间好好理一下关于设计模式方面的知识点，给自己增加点面试的底气。

在上一篇文章『面试的底气』—— 设计模式之代理模式(一) 用类来实现代理模式中的虚拟代理，而不使用类的方式也可以实现代理模式，比如用高阶函数也可以实现一个代理模式。本文就用高阶函数来动态创建一个缓存代理来再次介绍代理模式。

缓存代理

缓存代理可以为一些开销大的运算结果提供暂时的存储，在下次运算时，如果传递进来的参 数跟之前一致，则可以直接返回前面存储的运算结果。

高阶函数简单的可以理解为把一个函数作为参数传入一个函数中。那么如何用高阶函数动态创建一个缓存代理，就是实现一个专门用于创建缓存代理的工厂函数，把要代理的函数传入这个工厂函数，返回一个代理函数。

const createProxyFactory = (fn) =>{
  let cache = {};
  return function () {
    const args = Array.prototype.join.call(arguments, ',');
    if (args in cache) {
      return cache[args];
    }
    return cache[args] = fn.apply(this, arguments);
  }
};
复制代码

比如现在要为一个计算乘积的mult函数实现缓存代理，

const mult = function () {
  let a = 1;
  for (let i = 0, l = arguments.length; i < l; i++) {
    a = a * arguments[i];
  }
  return a;
};
复制代码

把mult函数当作参数传入createProxyFactory这个创建缓存代理的函数中即可为mult函数实现缓存代理。

小结

代理模式可以符合单一职责原则，使被代理函数的职责单一，使被代理函数高内聚。可以满足开放-封闭原则，使得被代理函数封闭，对其扩展新功能在代理函数中实现，使被代理函数低耦合。

虽然代理模式非常有用，但我们在编写业务代码的时候，往往不需要去预先猜测是否需要使用代理模式。
当真正发现不方便直接访问某个对象或改变某个函数的内部代码时，再编写代理也不迟。