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 相关文章推荐
JavaScript 类似flash效果的立体图片浏览器
Feb 08 Javascript
Js base64 加密解密介绍
Oct 11 Javascript
JavaScript操作Cookie详解
Feb 28 Javascript
详解JavaScript中的forEach()方法的使用
Jun 08 Javascript
Jquery幻灯片特效代码分享--鼠标点击按钮时切换(1)
Aug 15 Javascript
获取阴历(农历)和当前日期的js代码
Feb 15 Javascript
vue一步步实现alert功能
Jul 05 Javascript
手机注册发送验证码倒计时的简单实例
Nov 15 Javascript
基于vue 实现token验证的实例代码
Dec 14 Javascript
vue+axios 前端实现登录拦截的两种方式(路由拦截、http拦截)
Oct 24 Javascript
微信小程序人脸识别功能代码实例
May 07 Javascript
JavaScript中的null和undefined用法解析
Sep 30 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
大师制作的中短波矿石收音机
2020/04/02 无线电
用PHP和MySQL保存和输出图片
2006/10/09 PHP
在PWS上安装PHP4.0正式版
2006/10/09 PHP
php 数学运算验证码实现代码
2009/10/11 PHP
php字符比较函数similar_text、strnatcmp与strcasecmp用法分析
2014/11/18 PHP
详解WordPress中用于合成数组的wp_parse_args()函数
2015/12/18 PHP
Laravel中Trait的用法实例详解
2016/03/16 PHP
PHP _construct()函数讲解
2019/02/03 PHP
JQuery AJAX实现目录浏览与编辑的代码
2008/10/21 Javascript
jQuery控制输入框只能输入数值的小例子
2013/03/20 Javascript
Javascript的闭包详解
2014/12/26 Javascript
JS实现无限级网页折叠菜单(类似树形菜单)效果代码
2015/09/17 Javascript
JavaScript知识点总结(六)之JavaScript判断变量数据类型
2016/05/31 Javascript
jQuery 判断是否包含在数组中Array[]的方法
2016/08/03 Javascript
JavaScript中的编码和解码函数
2017/02/15 Javascript
jQuery鼠标悬停内容动画切换效果
2017/04/27 jQuery
vue2 自定义动态组件所遇到的问题
2017/06/08 Javascript
vue中的模态对话框组件实现过程
2018/05/01 Javascript
详解vue组件开发脚手架
2018/06/15 Javascript
微信小程序动态添加view组件的实例代码
2019/05/23 Javascript
使用Python的turtle模块画图的方法
2017/11/15 Python
Numpy中转置transpose、T和swapaxes的实例讲解
2018/04/17 Python
python实现跨excel的工作表sheet之间的复制方法
2018/05/03 Python
利用Python查看微信共同好友功能的实现代码
2019/04/24 Python
python使用协程实现并发操作的方法详解
2019/12/27 Python
PyInstaller将Python文件打包为exe后如何反编译(破解源码)以及防止反编译
2020/04/15 Python
Python实现aes加密解密多种方法解析
2020/05/15 Python
Python使用windows设置定时执行脚本
2020/11/12 Python
CSS3+HTML5+JS 实现一个块的收缩与展开动画效果
2020/11/17 HTML / CSS
HTML5注册表单的自动聚焦与占位文本示例代码
2013/07/19 HTML / CSS
巴基斯坦电子产品购物网站:Home Shopping
2017/09/14 全球购物
Jdbc数据访问技术面试题
2012/03/30 面试题
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
2015元旦家电促销活动策划方案
2014/12/09 职场文书
民主评议党员个人自我评价
2015/03/03 职场文书
Java 将PPT幻灯片转为HTML文件的实现思路
2021/06/11 Java/Android