资讯专栏INFORMATION COLUMN

每天一个设计模式·代理模式

MasonEast / 1370人阅读

摘要:代理模式原文地址更多设计模式系列教程更多免费教程博主按每天一个设计模式旨在初步领会设计模式的精髓,目前采用靠这吃饭和纯粹喜欢两种语言实现。代理模式优缺点代理模式有高度解耦对象保护易修改等优点。

代理模式·原文地址

更多《设计模式系列教程》

更多免费教程

博主按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用javascript(_靠这吃饭_)和python(_纯粹喜欢_)两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式 :)
0. 项目地址

本节课代码

《每天一个设计模式》地址

1. 什么是代理模式?
代理模式的定义:为一个对象提供一种代理以方便对它的访问。

代理模式可以解决避免对一些对象的直接访问,以此为基础,常见的有保护代理和虚拟代理。保护代理可以在代理中直接拒绝对对象的访问;虚拟代理可以延迟访问到真正需要的时候,以节省程序开销。

2. 代理模式优缺点

代理模式有高度解耦、对象保护、易修改等优点。

同样地,因为是通过“代理”访问对象,因此开销会更大,时间也会更慢。

3. 代码实现 3.1 python3 实现
class Image:
  def __init__(self, filename):
    self.filename = filename

  def load_img(self):
    print("finish load " + self.filename)

  def display(self):
    print("display " + self.filename)

# 借助继承来实现代理模式
class ImageProxy(Image):
  def __init__(self, filename):
    super().__init__(filename)
    self.loaded = False

  def load_img(self):
    if self.loaded == False:
      super().load_img()
    self.loaded = True

  def display(self):
    return super().display()


if __name__ == "__main__":
  proxyImg = ImageProxy("./js/image.png")

  # 只加载一次,其它均被代理拦截
  # 达到节省资源的目的
  for i in range(0,10):
    proxyImg.load_img()

  proxyImg.display()
3.2 javascript 实现

main.js :

// main.js
const myImg = {
  setSrc(imgNode, src) {
    imgNode.src = src;
  }
};

// 利用代理模式实现图片懒加载
const proxyImg = {
  setSrc(imgNode, src) {
    myImg.setSrc(imgNode, "./image.png"); // NO1. 加载占位图片并且将图片放入元素

    let img = new Image();
    img.onload = () => {
      myImg.setSrc(imgNode, src); // NO3. 完成加载后, 更新  元素中的图片
    };
    img.src = src; // NO2. 加载真正需要的图片
  }
};

let imgNode = document.createElement("img"),
  imgSrc =
    "https://upload-images.jianshu.io/upload_images/5486602-5cab95ba00b272bd.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1000/format/webp";

document.body.appendChild(imgNode);

proxyImg.setSrc(imgNode, imgSrc);

main.html :





  
  
  
  每天一个设计模式 · 代理模式


  

4. 参考

代理模式

《JavaScript 设计模式和开发实践》

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/42669.html

相关文章

  • 每天一个设计模式·代理模式

    摘要:代理模式原文地址更多设计模式系列教程更多免费教程博主按每天一个设计模式旨在初步领会设计模式的精髓,目前采用靠这吃饭和纯粹喜欢两种语言实现。代理模式优缺点代理模式有高度解耦对象保护易修改等优点。 代理模式·原文地址 更多《设计模式系列教程》 更多免费教程 博主按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用javascript(_靠这吃饭_)和python(_纯粹喜欢_)...

    XiNGRZ 评论0 收藏0
  • 给女朋友讲解什么是代理模式

    摘要:受知乎文章和设计模式之禅的启发,我也来搞一篇脑洞小开的文章由标题可知,这篇文章是写给我女朋友看的。于是这就让经纪人对粉丝说只有万,我才会写代码。 前言 只有光头才能变强 回顾前面: ThreadLocal就是这么简单 多线程三分钟就可以入个门了! 多线程基础必要知识点!看了学习多线程事半功倍 Java锁机制了解一下 AQS简简单单过一遍 Lock锁子类了解一下 线程池你真不来了解一下...

    stormgens 评论0 收藏0
  • 请节约你的请求-代理模式

    摘要:虚拟代理和函数节流的思想是一样的,将用户对性能的的伤害降低到最低。虚拟代理上面的保护代理阐述了怎样去拒绝请求,而虚拟代理的原则是收集请求来者不拒他的出发点和保护代理的是一样的,都是为了节省请求的开支。 Whats the proxy pattern? 代理模式其实就是将违反单一性原则的类给抽离出来,尽量满足开放和封闭的原则。 相当于一个类的行为只是一种,但是你可以给这个类添加额外的行为...

    OpenDigg 评论0 收藏0
  • Java 高级面试知识点汇总!

    摘要:适配器模式将一个类的接口转换成客户希望的另外一个接口。适配器模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。这个主题对象在状态发生变化时,会通知所有观察者对象,使它们能够自动更新自己。 1、常用设计模式 单例模式:懒汉式、饿汉式、双重校验锁、静态加载,内部类加载、枚举类加载。保证一个类仅有一个实例,并提供一个访问它的全局访问点。 代理模式:动态代理和静态代理,什么时候使用...

    since1986 评论0 收藏0
  • php设计模式

    摘要:我们今天也来做一个万能遥控器设计模式适配器模式将一个类的接口转换成客户希望的另外一个接口。今天要介绍的仍然是创建型设计模式的一种建造者模式。设计模式的理论知识固然重要,但 计算机程序的思维逻辑 (54) - 剖析 Collections - 设计模式 上节我们提到,类 Collections 中大概有两类功能,第一类是对容器接口对象进行操作,第二类是返回一个容器接口对象,上节我们介绍了...

    Dionysus_go 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<