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 相关文章推荐
javascript new fun的执行过程
Aug 05 Javascript
ExtJs 表单提交登陆实现代码
Aug 19 Javascript
使用js写的一个简易的投票
Nov 27 Javascript
基于jQuery.Hz2Py.js插件实现的汉字转拼音特效
May 07 Javascript
js+CSS实现模拟华丽的select控件下拉菜单效果
Sep 01 Javascript
在线引用最新jquery文件的实现方法
Aug 26 Javascript
浅谈jquery中next与siblings的区别
Oct 27 Javascript
详解Angular 中 ngOnInit 和 constructor 使用场景
Jun 22 Javascript
Angularjs使用过滤器完成排序功能
Sep 20 Javascript
React中的render何时执行过程
Apr 13 Javascript
vue-cli初始化项目中使用less的方法
Aug 09 Javascript
微信小程序外卖选购页实现切换分类与数量加减功能案例
Jan 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
vBulletin HACK----关于排版的两个HACK
2006/10/09 PHP
PHP 设计模式之观察者模式介绍
2012/02/22 PHP
php创建session的方法实例详解
2015/01/27 PHP
PHP实现验证码校验功能
2017/11/16 PHP
php pdo连接数据库操作示例
2019/11/18 PHP
php7 图形用户界面GUI 开发示例
2020/02/22 PHP
form中限制文本字节数js代码
2007/06/10 Javascript
Javascript验证上传图片大小[前台处理]
2014/07/18 Javascript
js实现在网页上简单显示时间的方法
2015/03/02 Javascript
jQuery消息提示框插件Tipso
2015/05/04 Javascript
分享JS数组求和与求最大值的方法
2016/08/11 Javascript
AngularGauge 属性解析详解
2016/09/06 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
JS中touchstart事件与click事件冲突的解决方法
2018/03/12 Javascript
vue + webpack如何绕过QQ音乐接口对host的验证详解
2018/07/01 Javascript
layerUI下的绑定事件实例代码
2018/08/17 Javascript
关于JavaScript 数组你应该知道的事情(推荐)
2019/04/10 Javascript
bootstrap table列和表头对不齐的解决方法
2019/07/19 Javascript
vue 实现强制类型转换 数字类型转为字符串
2019/11/07 Javascript
AutoJs实现刷宝短视频的思路详解
2020/05/22 Javascript
[01:42:49]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第一场 2月26日
2021/03/11 DOTA
Python中字典映射类型的学习教程
2015/08/20 Python
Python三种遍历文件目录的方法实例代码
2018/01/19 Python
Python生成一个迭代器的实操方法
2019/06/18 Python
tensorflow2.0保存和恢复模型3种方法
2020/02/03 Python
Python3监控疫情的完整代码
2020/02/20 Python
区域销售经理岗位职责
2013/12/10 职场文书
社区十八大感言
2014/01/19 职场文书
年会活动策划方案
2014/01/23 职场文书
初中学生期末评语
2014/04/24 职场文书
2014年安全生产责任书
2014/07/22 职场文书
政府个人对照检查材料
2014/08/28 职场文书
县长群众路线对照检查材料思想汇报
2014/10/02 职场文书
会计人员岗位职责
2015/02/03 职场文书
Web前端:CSS最强总结 附详细代码
2021/03/31 HTML / CSS
python中sys模块的介绍与实例
2021/04/17 Python