javascript设计模式 ? 访问者模式原理与用法实例分析


Posted in Javascript onApril 26, 2020

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

介绍:访问者模式比较复杂,它包含访问者和被访问元素两个主要组成部分,这些被访问的元素通常具有不同的类型,且不同的访问者可以对他们进行不同的访问操作。访问者模式的主要目的是将数据结构与数据操作相分离。

定义:提供一个作用于某对象结构中的个元素的操作表示,它使得可以再不改变各元素的类的前提下定义作用于这些元素的新操作。访问者模式是一种对象行为型模式

场景:使用PC结构demo来解释下访问者模式

示例:

var Keyboard = function(){
  this.accept = function(computerPartVisitor){
    computerPartVisitor.visit(this);
  }
}
 
var Monitor = function(){
  this.accept = function(computerPartVisitor){
    computerPartVisitor.visit(this);
  }
}
 
var Mouse = function(){
  this.accept = function(computerPartVisitor){
    computerPartVisitor.visit(this);
  }
}
 
var Computer = function(){
  var parts = [new Keyboard(), new Monitor(), new Mouse()];
 
  this.accept = function(computerPartVisitor){
    computerPartVisitor.visit(this);
    _acceptAll(computerPartVisitor);
  }
 
  var _acceptAll = function(computerPartVisitor){
    parts.map(function(item){
      item.accept(computerPartVisitor)
    });
  }
}
 
var ComputerPartDisplayVisitor = function(){
  this.visit = function(item){
    if(item.constructor == Keyboard){
      console.log("Displaying Keyboard.");
    }else if(item.constructor == Monitor){
      console.log("Displaying Monitor.");
    }else if(item.constructor == Mouse){
      console.log("Displaying Mouse.");
    }else if(item.constructor == Computer){
      console.log("Displaying Computer.");
    }else{
      console.log("Error");
    }
  }
}
 
var computer = new Computer();
computer.accept(new ComputerPartDisplayVisitor());
// Displaying Computer.
// Displaying Keyboard.
// Displaying Monitor.
// Displaying Mouse.

这个模式比较复杂,我们先介绍下组成:

  • ComputerPartDisplayVisitor称为访问者,它为对象结构中的每一个具体元素例如Keyboard,Mouse等声明一个访问操作。当访问Keyboard时就会输出Displaying Keyboard。
  • Keyboard,Monitor,Mouse称为元素,他们包含一个accept方法,用来触发传递进来的访问者
  • Computer称为对象结构,它是一个元素的集合。parts数组用于存放元素对象,以供不同访问者访问。_acceptAll方法用来遍历内部元素。
  • 访问者通过accept访问元素内部,元素内部也可以通过参数调用访问者的visit方法。这种调用机制称为双重分派。

访问者模式总结:

优点:
* 增加新的访问操作便捷,只需要加一个新的访问者类。
* 将有关原色对象的访问行为集合到一个访问者对象中,类的职责更清晰。
* 让用户在不修改现有元素层次结构的情况下,定义作用于该层次结构的操作。

缺点:
* 增加新的元素类很困难,在访问者模式下,每增加一个新的元素,对应要增加访问者中的操作。
* 破坏封装。访问者模式要求访问者对象访问并调用每一个元素对象的操作,这意味着元素必须暴露一些内部操作和内部状态。

适用场景:
* 一个对象结构包含多个类型的对象,希望对这些对象实施一些依赖其具体类型的操作。
* 需要对一个对象结构中的对象进行横多不同的并且不相关的操作,而且需要避免让这些操作污染这些对象的类。
* 对象结构中对象对应的类很少改变,但经常需要再次对象结构上定义新的操作。

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

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

Javascript 相关文章推荐
最简单的jQuery程序 入门者学习
Jul 09 Javascript
JQuery Easyui Tree的oncheck事件实现代码
May 28 Javascript
jquery 学习之二 属性(类)
Nov 25 Javascript
JS判断字符串长度的5个方法(区分中文和英文)
Mar 18 Javascript
JavaScript淡入淡出渐变简单实例
Aug 06 Javascript
JS 获取HTML标签内的子节点的方法
Sep 21 Javascript
AngularJS 单选框及多选框的双向动态绑定
Apr 20 Javascript
在Js页面通过POST传递参数跳转到新页面详解
Aug 25 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
Jul 06 Javascript
vue-router的使用方法及含参数的配置方法
Nov 13 Javascript
通过实例了解Javascript柯里化流程
Mar 03 Javascript
7个你应该知道的JS原生错误类型
Apr 29 Javascript
详解关于Vue单元测试的几个坑
Apr 26 #Javascript
es6函数之箭头函数用法实例详解
Apr 25 #Javascript
es6数组之扩展运算符操作实例分析
Apr 25 #Javascript
es6函数之尾调用优化实例分析
Apr 25 #Javascript
es6函数之尾递归用法实例分析
Apr 25 #Javascript
javascript 易错知识点实例小结
Apr 25 #Javascript
javascript执行上下文、变量对象实例分析
Apr 25 #Javascript
You might like
服务器变量 $_SERVER 的深入解析
2013/07/02 PHP
PHP整合PayPal支付
2015/06/11 PHP
PHP MSSQL 分页实例
2016/04/13 PHP
弹出模态框modal的实现方法及实例
2017/09/19 PHP
Laravel 自动转换长整型雪花 ID 为字符串的实现
2020/10/27 PHP
jquery 新手学习常见问题解决方法
2010/04/18 Javascript
验证控件与Button的OnClientClick事件详细解析
2013/12/04 Javascript
Jquery操作js数组及对象示例代码
2014/05/11 Javascript
javascript实现滑动解锁功能
2014/12/31 Javascript
jQuery实现加入购物车飞入动画效果
2015/03/14 Javascript
jQuery原理系列-css选择器的简单实现
2016/06/07 Javascript
jQuery查看选中对象HTML代码的方法
2016/06/17 Javascript
详解JQuery基础动画操作
2019/04/12 jQuery
详细讲解如何创建, 发布自己的 Vue UI 组件库
2019/05/29 Javascript
elementUi vue el-radio 监听选中变化的实例代码
2019/06/28 Javascript
解决layer图标icon不加载的问题
2019/09/04 Javascript
JavaScript实现移动端弹窗后禁止滚动
2020/05/25 Javascript
详解vue中v-on事件监听指令的基本用法
2020/07/22 Javascript
vue实现广告栏上下滚动效果
2020/11/26 Vue.js
python rsa 加密解密
2017/03/20 Python
python实现矩阵打印
2019/03/02 Python
PyTorch的SoftMax交叉熵损失和梯度用法
2020/01/15 Python
关于tf.nn.dynamic_rnn返回值详解
2020/01/20 Python
python获取整个网页源码的方法
2020/08/03 Python
英国鲜花递送:Blossoming Gifts
2020/07/10 全球购物
面试后的感谢信范文
2014/02/01 职场文书
光信息科学与技术专业职业生涯规划
2014/03/13 职场文书
感恩父母的演讲稿
2014/05/06 职场文书
院党委组织查摆问题对照检查材料思想汇报2014
2014/10/08 职场文书
2014年妇联工作总结
2014/11/21 职场文书
服务承诺书
2015/01/19 职场文书
刑事申诉状范文
2015/05/20 职场文书
2019终止劳动合同协议书最新范本!
2019/07/09 职场文书
护理专业毕业自我鉴定
2019/08/12 职场文书
导游词之介休绵山
2019/12/31 职场文书
分享CSS盒子模型隐藏的几种方式
2022/02/28 HTML / CSS