代理模式是为一个对象提供一个代用品或者占位符，以便控制对它的访问。
代理模式是一种极为有趣的模式，生活中我们可以找到很多代理模式的场景。比如明星的经纪人，一般的商业活动不会直接跟明星接触，而是和经纪人谈，经纪人会把工作内容和报酬谈好之后在交给明星。
下面我们用一个明星买包的例子来解释下代理
当明星没有经济人 自己买包
// 定义一个包类classBags{constructor(props){this.name=props;}getName(){returnthis.name;}}// 定义一个明星对象classStar{buyBag(bag){console.log(`买到了一个${bag.getName()}包`);}}// 创建一个明星实例letstar=newStar();star.buyBag(newBags('Coach'));//买到了一个Coach包当明星让自己的助理去买包
// 定义一个包类classBags{constructor(props){this.name=props;}getName(){returnthis.name;}}// 定义一个助理对象classAssistant{constructor(props){this.star=props;}buyBag(bag){this.star.buyBag(bag);}}// 定义一个明星对象classStar{buyBag(bag){console.log(`买到了一个${bag.getName()}包`);}}// 创建一个明星实例letstar=newStar();letassistant=newAssistant(star);assistant.buyBag(newBags('Coach'));//买到了一个Coach包此时我们就实现了一个简单的代理模式，但一般我们不会在这么简单的场景使用代理，反而徒增了代码的复杂度。
图片的懒加载是前端中比较会用到代理模式的场景，当网络不好的时候，图片的加载需要一段时间，这就会产生空白，影响用户体验，这时候在图片真正加载完之前，使用一张loading占位图片，等图片真正加载完在设置src属性，来实现图片的懒加载。
classABigImage{constructor(){this.img=newImage();document.body.appendChild(this.img);}setSrc(src){this.img.src=src;}}classProxyImage{constructor(){this.proxyImage=newImage();}setSrc(src){letbigImageObj=newABigImage();bigImageObj.img.src='./local.png';// 低清晰度图片url 或者本地图片this.proxyImage.src=src;this.proxyImage.onload=function(){bigImageObj.img.src=src;}}}varproxyImage=newProxyImage();proxyImage.setSrc('图片Url')在演示中我们可以感受到 （启用chrome的 Network 中的 Disable cache 并设置网速为 slow 3G 会让我们有更直观的感受）
到这里图片的预加载已经实现，并且当我们的网速非常好，已经达到可以取消图片预加载的一些问题，那么我们可以直接使用ABigImage的setSrc方法，并且删除代理类，这样我们根本就不许要改动本体代码，这是易于维护的。
// 网速很快时
let aImage = new ABigImage();
aImage.setSrc('图片url')
- 代理模式符合开放封闭原则。
- 代理模式会让代码易于维护。
- 本体对象一般和代理对象拥有相同的方法，所以使用者并不知道请求的是本体对象还是代理对象。
本例中所有的例子均可在 Demo查看