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 相关文章推荐
怎么让脚本或里面的函数在所有图片都载入完毕的时候执行
Oct 17 Javascript
Javascript优化技巧(文件瘦身篇)
Jan 28 Javascript
ExtJs之带图片的下拉列表框插件
Mar 04 Javascript
超级24小时弹窗代码 24小时退出弹窗代码 100%弹窗代码(IE only)
Jun 11 Javascript
jquery调用asp.net 页面后台的实现代码
Apr 27 Javascript
jquery解析XML字符串和XML文件的方法说明
Feb 21 Javascript
jQuery css() 方法动态修改CSS属性
Sep 25 Javascript
jquery对象和DOM对象的相互转换详解
Oct 18 Javascript
JS/HTML5游戏常用算法之追踪算法实例详解
Dec 12 Javascript
详解可以用在VS Code中的正则表达式小技巧
May 14 Javascript
小程序中canvas的drawImage方法参数使用详解
Jul 04 Javascript
JavaScript代码实现简单计算器
Dec 27 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 不同编码下的字符串长度区分
2009/09/26 PHP
php支付宝系列之电脑网站支付
2018/05/30 PHP
javascript中length属性的探索
2011/07/31 Javascript
javaScript 删除字符串空格多种方法小结
2012/10/24 Javascript
javascript中[]和{}对象使用介绍
2013/03/20 Javascript
JS中批量给元素绑定事件过程中的相关问题使用闭包解决
2013/04/15 Javascript
JS将数字转换成三位逗号分隔的样式(示例代码)
2014/02/19 Javascript
AngularJS快速入门
2015/04/02 Javascript
跟我学习javascript的prototype原型和原型链
2015/11/18 Javascript
EasyUI学习之Combobox下拉列表(1)
2016/12/29 Javascript
微信小程序开发(一) 微信登录流程详解
2017/01/11 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
2018/09/28 Javascript
jQuery.parseJSON()函数详解
2019/02/28 jQuery
微信小程序:数据存储、传值、取值详解
2019/05/07 Javascript
layer.prompt输入层的例子
2019/09/24 Javascript
Vue 中 template 有且只能一个 root的原因解析(源码分析)
2020/04/11 Javascript
[22:59]VGJ.S vs VG 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
调试Python程序代码的几种方法总结
2015/04/28 Python
Python实现方便使用的级联进度信息实例
2015/05/05 Python
在Python的Django框架中更新数据库数据的方法
2015/07/17 Python
解决Tensorflow使用pip安装后没有model目录的问题
2018/06/13 Python
python3中函数参数的四种简单用法
2018/07/09 Python
python根据文章标题内容自动生成摘要的实例
2019/02/21 Python
使用WingPro 7 设置Python路径的方法
2019/07/24 Python
幼儿园教学管理制度
2014/02/04 职场文书
秸秆管理实施方案
2014/03/15 职场文书
爱心活动计划书
2014/04/26 职场文书
初中学校军训方案
2014/05/09 职场文书
合同意向书范本
2014/07/30 职场文书
《周恩来的四个昼夜》观后思想汇报范文两篇
2014/09/10 职场文书
2014最新毕业证代领委托书
2014/09/26 职场文书
师德师风自查总结
2014/10/14 职场文书
小区环境卫生倡议书
2015/04/29 职场文书
情人节单身感言
2015/08/03 职场文书
php去除deprecated的实例方法
2021/11/17 PHP
vue修饰符.capture和.self的区别
2022/04/22 Vue.js