javascript设计模式 ? 代理模式原理与用法实例分析


Posted in Javascript onApril 16, 2020

本文实例讲述了javascript设计模式 ? 代理模式原理与用法。分享给大家供大家参考,具体如下:

介绍:代理使我们很常见的一众模式,proxy,nginx都称之为代理,代理是什么意思呢?代理模式在客户端和目标对象之间加入一个新的代理对象,代理对象起到一个中介作用,去掉客户不能看到的内容和服务,或者增添客户需要的额外服务。

定义:给某一个对象提供一个代理,并由代理对象控制对原对象的引用。代理模式是一种对象结构型模式。

场景:我们还是以画图形为例,我将所有的绘图动作包装到Shape类中,使用代理模式来部分开放功能给客户。

示例:

var Shape = function(color){
  console.log('创建了一个对象');
  this.color = color;
  this.x;
  this.y;
  this.radius;
 
  this.setAttr = function(x, y, radius){
    this.x = x;
    this.y = y;
    this.radius = radius;
  }
  this.drawCircle = function(){
    console.log('画圆: 颜色:' + this.color + ' x:' + this.x + ' y:' + this.y + ' radius:' + this.radius)
  }
  this.drawSquare = function(){
    console.log('画方: 颜色:' + this.color + ' x:' + this.x + ' y:' + this.y )
  }
  this.drawTriangle = function(){
    console.log('画三角: 颜色:' + this.color + ' x:' + this.x + ' y:' + this.y )
  }
}
 
var proxyShape = function(color, x, y, radius){
  this.color = color;
  this.x = x;
  this.y = y;
  this.radius = radius;
  this.shape = null;
  this.drawSquare = function(){
    if(this.shape === null){
      this.shape = new Shape(this.color);
      this.shape.setAttr(this.x, this.y, this.radius);
    }
    this.shape.drawSquare();
  }
}
 
var square = new proxyShape('red', 10, 10);
square.drawSquare();
square.drawSquare();
// 创建了一个对象
// 画方: 颜色:red x:10 y:10
// 画方: 颜色:red x:10 y:10

你可以在proxyShape中增加一些日志,权限等任务。因为代理类的存在,新增的任务不会影响到Shape类。

代理模式为对象的简介访问提供了解决方案,可以对对象的访问进行控制。

代理模式总结:

优点:
* 代理模式可以协调调用者和被调用这,一定程度降低了系统耦合度。

缺点:
* 由于增加了代理对象,因此有些类型的代理模式可能会造成请求的处理速度变慢。
* 实现代理模式需要额外的工作,有些代理模式的实现非常复杂。

适用场景:
* 当客户端需要访问远程主机中的对象时,可以使用远程代理。
* 当需要用一个消耗资源较少的对象来代表资源消耗较多的对象,可以使用虚拟代理
* 当需要控制一个对象的访问,为不同用户提供不同级别的访问权限时可以使用保护代理

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

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

Javascript 相关文章推荐
比较简单实用的使用正则三种版本的js去空格处理方法
Nov 18 Javascript
兼容IE和Firefox火狐的上下、左右循环无间断滚动JS代码
Apr 19 Javascript
jQuery实现网站添加高亮突出显示效果的方法
Jun 26 Javascript
javascript作用域问题实例分析
Jul 13 Javascript
javascript获取select标签选中的值
Jun 04 Javascript
Javascript获取图片原始宽度和高度的方法详解
Sep 20 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
Apr 27 jQuery
angular或者js怎么确定选中ul中的哪几个li
Aug 16 Javascript
探索webpack模块及webpack3新特性
Sep 18 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
Jan 13 Javascript
使用puppeteer破解极验的滑动验证码
Feb 24 Javascript
基于Three.js实现360度全景图片
Dec 30 Javascript
js String.prototype.trim字符去前后空格的扩展
Aug 23 #Javascript
Vue Object 的变化侦测实现代码
Apr 15 #Javascript
Vue项目vscode 安装eslint插件的方法(代码自动修复)
Apr 15 #Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
Apr 15 #Javascript
javascript设计模式 ? 享元模式原理与用法实例分析
Apr 15 #Javascript
javascript设计模式 ? 外观模式原理与用法实例分析
Apr 15 #Javascript
写给新手同学的vuex快速上手指北小结
Apr 14 #Javascript
You might like
《OVERLORD》第四季,终于等到你!
2020/03/02 日漫
论坛头像随机变换代码
2006/10/09 PHP
PHP中for循环语句的几种变型
2007/03/16 PHP
php中opendir函数用法实例
2014/11/15 PHP
php常用图片处理类
2016/03/16 PHP
thinkphp框架下404页面设置 仅三步
2016/05/14 PHP
PHP中使用foreach()遍历二维数组的简单实例
2016/06/13 PHP
php 获取xml接口数据的处理方法
2018/05/31 PHP
Thinkphp整合阿里云OSS图片上传实例代码
2019/04/28 PHP
PHP实现页面静态化深入讲解
2021/03/04 PHP
十个迅速提升JQuery性能让你的JQuery跑得更快
2012/12/10 Javascript
给js文件传参数(详解)
2014/07/13 Javascript
Angularjs编写KindEditor,UEidtor,jQuery指令
2015/01/28 Javascript
使用veloticy-ui生成文字动画效果
2018/02/08 Javascript
JS求Number类型数组中最大元素方法
2018/04/08 Javascript
js中Object.defineProperty()方法的不详解
2018/07/09 Javascript
生产制造追溯系统之在线打印功能
2019/06/03 Javascript
解决node终端下运行js文件不支持ES6语法
2020/04/04 Javascript
基于python select.select模块通信的实例讲解
2017/09/21 Python
python 实现多维数组转向量
2019/11/30 Python
django自定义模板标签过程解析
2019/12/14 Python
Python django框架开发发布会签到系统(web开发)
2020/02/12 Python
Python使用uuid库生成唯一标识ID
2020/02/12 Python
Pandas中DataFrame交换列顺序的方法实现
2020/12/14 Python
详解HTML5 LocalStorage 本地存储
2016/12/23 HTML / CSS
美国最受欢迎的度假目的地优惠套餐:BookVIP
2018/09/27 全球购物
意大利折扣和优惠券网站:Groupalia
2019/10/09 全球购物
俄罗斯在线水暖商店:Perfecto.ru
2019/10/25 全球购物
毕业研究生的自我鉴定
2013/11/30 职场文书
企业元宵节主持词
2014/03/25 职场文书
毕业自我鉴定怎么写
2014/03/25 职场文书
精神文明建设先进工作者事迹材料
2014/05/02 职场文书
公司会议策划方案
2014/05/17 职场文书
商场促销活动策划方案
2014/08/18 职场文书
教师党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
建筑专业毕业生求职信
2014/09/30 职场文书