JavaScript设计模式之代理模式简单实例教程


Posted in Javascript onJuly 03, 2018

本文实例讲述了JavaScript设计模式之代理模式。分享给大家供大家参考,具体如下:

一、代理模式概念

代理,顾名思义就是帮助别人做事,GoF对代理模式的定义如下:

代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问。代理模式使得代理对象控制具体对象的引用。代理几乎可以是任何对象:文件,资源,内存中的对象,或者是一些难以复制的东西。

解释:房屋中介,可以代理帮助卖家把房子卖给买家,这中间卖家说要卖的价钱就可以了,买家也可以提出自己要买的房型,中介可以帮忙处理中间环节。最后达成买卖。中介可以同时代理很多房屋买卖,并且可以代理租房事宜。

代理模式的组成:

抽象角色:通过接口或抽象类声明真实角色实现的业务方法。

代理角色:实现抽象角色,是真实角色的代理,通过真实角色的业务逻辑方法来实现抽象方法,并可以附加自己的操作。

真实角色:实现抽象角色,定义真实角色所要实现的业务逻辑,供代理角色调用。

二、代理模式的作用和注意事项

模式作用:

1、远程代理(一个对象将不同空间的对象进行局部代理)

2、虚拟代理(根据需要创建开销很大的对象如渲染网页暂时用占位代替真图)

3、安全代理(控制证实对象的访问权限)

4、智能指引(调用对象代理处理另外一些事情如垃圾回收机制)

注意事项:

1、不能滥用代理,有时候仅仅是给代码增加复杂度

三、代理模式代码和实战总结

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title>代理模式</title>
</head>
<body>
<script>
 //代理模式需要三方
 //1.买家
 function maijia(){
  this.name = "小明";
  this.money = "30万";
 }
 //2.中介
 function zhongjie(){
 }
 zhongjie.prototype.maifang = function(){
  //new fongdong(new maijia()).maifang("20万");
  new fongdong(new maijia()).maifang("20万");
 }
 //3.卖家
 function fongdong(maijia){
  this.maijia_name = maijia.name;
  this.maijia_money = maijia.money;
  this.maifang = function(money){
//   console.log("收到了来自【"+this.maijia_name+"】"+money+"人民币");
   console.log("收到了来自【"+this.maijia_name+"】"+this.maijia_money+"人民币");
  }
 }
 (new zhongjie()).maifang();
</script>
<script>
// A2B
 function A(){
  this.money = "20RMB";
 }
 function to(){
  if(!(this instanceof to)){
   return new to;
  }
 }
 to.prototype.maifang = function(){
  var a = new A();
  new B().maifang(a.money);
 }
 function B(){
  this.maifang = function(money){
   console.log("收到了钱"+money);
  }
 }
 (new to()).maifang();
 to().maifang();
</script>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具 http://tools.3water.com/code/HtmlJsRun测试运行效果如下:

JavaScript设计模式之代理模式简单实例教程

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

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

Javascript 相关文章推荐
Javascript中的this绑定介绍
Sep 22 Javascript
js数组操作常用方法
May 08 Javascript
分享一则JavaScript滚动条插件源码
Mar 03 Javascript
javascript原始值和对象引用实例分析
Apr 25 Javascript
浅谈JavaScript的push(),pop(),concat()方法
Jun 03 Javascript
如何清除IE10+ input X 文本框的叉叉和密码输入框的眼睛图标
Dec 21 Javascript
bootstrap提示标签、提示框实现代码
Dec 28 Javascript
Vue服务端渲染实践之Web应用首屏耗时最优化方案
Mar 22 Javascript
JQueryDOM之样式操作
Mar 27 jQuery
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 Javascript
小程序实现列表展开收起效果
Jul 29 Javascript
Vue中引入svg图标的两种方式
Jan 14 Vue.js
详解Vue中使用Echarts的两种方式
Jul 03 #Javascript
vue awesome swiper异步加载数据出现的bug问题
Jul 03 #Javascript
JavaScript设计模式之工厂模式简单实例教程
Jul 03 #Javascript
js实现各浏览器全屏代码实例
Jul 03 #Javascript
React Native基础入门之初步使用Flexbox布局
Jul 02 #Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 #Javascript
vue-router 源码实现前端路由的两种方式
Jul 02 #Javascript
You might like
农民和部队如何穿矿
2020/03/04 星际争霸
PHP7 整型处理机制修改
2021/03/09 PHP
一个很简单的办法实现TD的加亮效果.
2006/06/29 Javascript
JS鼠标事件大全 推荐收藏
2011/11/01 Javascript
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
css3元素简单的闪烁效果实现(html5 jquery)
2013/12/28 Javascript
jQuery trigger()方法用法介绍
2015/01/13 Javascript
使用pjax实现无刷新更改页面url
2015/02/05 Javascript
Javascript获取表单名称(name)的方法
2015/04/02 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
2015/10/09 Javascript
jQuery实现切换页面过渡动画效果
2015/10/29 Javascript
每日十条JavaScript经验技巧(二)
2016/06/23 Javascript
Javascript中级语法快速入手
2016/07/30 Javascript
js实现精确到毫秒的倒计时效果
2016/08/05 Javascript
JavaScript第一篇之实现按钮全选、功能
2016/08/21 Javascript
浅谈Angular HttpClient简单入门
2018/05/04 Javascript
通过jQuery学习js类型判断的技巧
2019/05/27 jQuery
javascript防抖函数debounce详解
2019/06/11 Javascript
vue回到顶部监听滚动事件详解
2019/08/02 Javascript
简单了解JS打开url的方法
2020/02/21 Javascript
浅谈JavaScript 声明提升
2020/09/14 Javascript
[43:41]OG vs Newbee 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.21.mp4
2020/07/19 DOTA
python自定义异常实例详解
2017/07/11 Python
关于Python的一些学习总结
2018/05/25 Python
Python urlopen()和urlretrieve()用法解析
2020/01/07 Python
python实现简单井字棋小游戏
2020/03/05 Python
使用OpenCV去除面积较小的连通域
2020/07/05 Python
使用phonegap进行本地存储的实现方法
2017/03/31 HTML / CSS
巴黎一票通:The Paris Pass
2018/02/10 全球购物
公司行政经理岗位职责
2013/12/24 职场文书
《蝙蝠和雷达》教学反思
2014/04/23 职场文书
家长建议怎么写
2014/05/15 职场文书
门面房租房协议书
2014/08/20 职场文书
2015年小学财务工作总结
2015/07/20 职场文书
学者《孟子》名人名言
2019/08/09 职场文书
vue Element-ui表格实现树形结构表格
2021/06/07 Vue.js