视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
学习JavaScript设计模式之代理模式_javascript技巧
2020-11-27 21:48:45 责编:小采
文档

  • 明星都有经纪人作为代理。如果请明星办一场商演,只能联系其经纪人,经纪人会把商演的细节和报酬谈好,再把合同交给明星签。
  • 一、定义

    代理模式:为一个对象提供一个代用品或占位符,以便控制对它的访问。
    代理分为:保护代理和虚拟代理
    保护代理:用于控制不同权限的对象对目标对象的访问,在JavaScript中很难判断谁访问了某个对象,所以保护代理很难实现。

    二、图片预加载(最常见的虚拟代理应用场景)

    图片预加载是一种常用技术,如果直接给某个img标签节点设置src属性,由于图片过大或者网络不佳,图片的位置往往有段时间会有空白。常见的做法事先用一张loading图片占位,然后异步加载图片,待图片加载完成,把其填充到img节点里。
    实现原理:
    创建一个Image对象:var a = new Image();
    定义Image对象的src: a.src = “xxx.gif”;
    这样做就相当于给浏览器缓存了一张图片。

    可通过Image对象的complete属性来检测图像是否加载完成。每个Image对象都有一个complete属性,当图像处于装载过程中时,该属性值false,当发生了onload、onerror、onabort中任何一个事件后,则表示图像装载过程结束,此时complete属性为true。

    (1)非代理实现

    
    
    

    (2)代理实现

    
    
    

    使用代理模式的好处:使每个函数功能单一,实现对象设计的“单一职责原则”!

    三、文件同步

    假设我们在做一个文件同步功能,当选中checkbox时候,它对应的文件就会被同步到另外一台服务器。

    
     文件1
     文件2
     文件3
     文件4
     文件5
     文件6
     

    没选中一个checkbox就同步一次,显然不太合理。因为在web开发中,最大的开销就是网络请求。
    解决方案:通过一个代理函数来收集一段时间之内的请求,然后一次性发给服务器。

    
    
    

    四、缓存代理–计算乘积(序列一模一样)

    
    
    

    希望本文所述对大家学习javascript程序设计有所帮助。

    下载本文
    显示全文
    专题