JS设计模式之访问者模式定义与用法分析


Posted in Javascript onFebruary 05, 2018

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

在访问者模式中,主要包括下面几个角色

1、抽象访问者:抽象类或者接口,声明访问者可以访问哪些元素,具体到程序中就是visit方法中的参数定义哪些对象是可以被访问的。
2、访问者:实现抽象访问者所声明的方法,它影响到访问者访问到一个类后该干什么,要做什么事情。
3、抽象元素类:接口或者抽象类,声明接受哪一类访问者访问,程序上是通过accept方法中的参数来定义的。抽象元素一般有两类方法,一部分是本身的业务逻辑,另外就是允许接收哪类访问者来访问。
4、元素类:实现抽象元素类所声明的accept方法,通常都是visitor.visit(this),基本上已经形成一种定式了。
5、结构对象:一个元素的容器,一般包含一个容纳多个不同类、不同接口的容器,如List、Set、Map等,在项目中一般很少抽象出这个角色。

实现代码:

// 访问者
function Visitor() {
 this.visit = function( concreteElement ) {
 concreteElement.doSomething();
 }
}
// 元素类
function ConceteElement() {
 this.doSomething = function() {
 console.log("这是一个具体元素");
 }
 this.accept = function( visitor ) {
 visitor.visit(this);
 }
}
// Client
var ele = new ConceteElement();
var v = new Visitor();
ele.accept( v );

访问者模式的优点

1、符合单一职责原则:凡是适用访问者模式的场景中,元素类中需要封装在访问者中的操作必定是与元素类本身关系不大且是易变的操作,使用访问者模式一方面符合单一职责原则,另一方面,因为被封装的操作通常来说都是易变的,所以当发生变化时,就可以在不改变元素类本身的前提下,实现对变化部分的扩展。

2、扩展性良好:元素类可以通过接受不同的访问者来实现对不同操作的扩展。

访问者模式的适用场景

1、假如一个对象中存在着一些与本对象不相干(或者关系较弱)的操作,为了避免这些操作污染这个对象,则可以使用访问者模式来把这些操作封装到访问者中去。

2、假如一组对象中,存在着相似的操作,为了避免出现大量重复的代码,也可以将这些重复的操作封装到访问者中去。

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

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

Javascript 相关文章推荐
js 表单验证方法(实用)
Apr 28 Javascript
JavaScript isPrototypeOf和hasOwnProperty使用区别
Mar 04 Javascript
javascript中caller和callee详解
Aug 10 Javascript
jQuery中的ajax async同步和异步详解
Sep 29 Javascript
jQuery实现悬浮在右上角的网页客服效果代码
Oct 24 Javascript
Javascript类型系统之undefined和null浅析
Jul 13 Javascript
你知道setTimeout是如何运行的吗?
Aug 16 Javascript
vue.js element-ui validate中代码不执行问题解决方法
Dec 18 Javascript
详解VueJs中的V-bind指令
May 03 Javascript
jQuery实现获取当前鼠标位置并输出功能示例
Jan 05 jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
ES6中let、const的区别及变量的解构赋值操作方法实例分析
Oct 15 Javascript
基于vue 动态加载图片src的解决方法
Feb 05 #Javascript
vue2.0 datepicker使用方法
Feb 04 #Javascript
js数组常用最重要的方法
Feb 04 #Javascript
jQuery Dom元素操作技巧
Feb 04 #jQuery
Vue的事件响应式进度条组件实例详解
Feb 04 #Javascript
JS实现不用中间变量temp 实现两个变量值得交换方法
Feb 04 #Javascript
Vue的土著指令和自定义指令实例详解
Feb 04 #Javascript
You might like
php获得用户ip地址的比较不错的方法
2014/02/08 PHP
PHP实现验证码校验功能
2017/11/16 PHP
对于this和$(this)的个人理解
2013/09/08 Javascript
nodejs npm package.json中文文档
2014/09/04 NodeJs
JAVA四种基本排序方法实例总结
2015/07/24 Javascript
详解JavaScript操作HTML DOM的基本方式
2015/10/21 Javascript
jQuery生成假加载动画效果
2016/12/01 Javascript
jQuery插件FusionCharts实现的2D面积图效果示例【附demo源码下载】
2017/03/06 Javascript
Angularjs使用指令做表单校验的方法
2017/03/31 Javascript
vue学习笔记之vue1.0和vue2.0的区别介绍
2017/05/17 Javascript
Vue的路由动态重定向和导航守卫实例
2018/03/17 Javascript
解决Vue2.0中使用less给元素添加背景图片出现的问题
2018/09/03 Javascript
在vue中实现点击选择框阻止弹出层消失的方法
2018/09/15 Javascript
React 使用recharts实现散点地图的示例代码
2018/12/07 Javascript
Vue项目实现换肤功能的一种方案分析
2019/08/28 Javascript
一步步解析Python斗牛游戏的概率
2016/02/12 Python
spyder常用快捷键(分享)
2017/07/19 Python
使用Python读取二进制文件的实例讲解
2018/07/09 Python
Python空间数据处理之GDAL读写遥感图像
2019/08/01 Python
python tqdm 实现滚动条不上下滚动代码(保持一行内滚动)
2020/02/19 Python
python GUI库图形界面开发之PyQt5打开保存对话框QFileDialog详细使用方法与实例
2020/02/27 Python
Python如何基于Tesseract实现识别文字功能
2020/06/05 Python
Python 使用 PyQt5 开发的关机小工具分享
2020/07/16 Python
Python3爬虫RedisDump的安装步骤
2021/02/20 Python
css3动画效果抖动解决方法
2018/09/03 HTML / CSS
CSS3动画之利用requestAnimationFrame触发重新播放功能
2019/09/11 HTML / CSS
如何利用input事件来监听移动端的输入
2016/04/15 HTML / CSS
前台领班岗位职责
2013/12/04 职场文书
地下停车场租赁协议范本
2014/10/07 职场文书
县人大领导班子四风对照检查材料思想汇报
2014/10/09 职场文书
金秋助学感谢信
2015/01/21 职场文书
汉字听写大会观后感
2015/06/12 职场文书
大学自主招生自荐信(2016精选篇)
2016/01/28 职场文书
《曹冲称象》教学反思
2016/02/20 职场文书
python自动统计zabbix系统监控覆盖率的示例代码
2021/04/03 Python
Java使用JMeter进行高并发测试
2021/11/23 Java/Android