微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

轻松掌握JavaScript代理模式

在面向对象设计中,有一个单一职责原则,指就一个类(对象、函数)而言,应该仅有一个引起它变化的原因。如果一个对象承担了过多的职责,就意味着它将变得巨大,引起它变化的原因就多,它把这些职责耦合到了一起,这种耦合会导致程序难于维护和重构。

这时候,我们可以把该对象(本体)的其中一部分职责分离出来给一些第三方对象去做,本体只管自己的一些核心职责,这些第三方对象就称作代理。代理对象可以作为对象(也叫“真正的主体”)的保护者,让真正的主体对象做尽量少的工作。在代理设计模式中,一个对象充当了另一个对象的接口的角色。

通常代理和本体的接口应该保持一致性,这样当不需要代理的时候,用户可直接访问本体。

当我们不方便直接访问一个对象时,就可以考虑给该对象招一个代理。

代理可用于:图片预加载、合并HTTP请求(代理收集一定时间内的所有HTTP请求,然后一次性发给服务器)、惰性加载(通过代理处理和收集一些基本操作,然后仅在真正需要本体的时候才加载本体)、缓存代理(缓存请求结果、计算结果)等

例子1:

图片预加载

rush:js;"> var myImage = (function(){ var imgNode = document.createElement('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('loading.gif'); img.src = src; } } })();

proxyImage.setSrc('show.jpg');

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐