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客户端将指定区域导出到Word、Excel的代码
Oct 22 Javascript
FireFox与IE 下js兼容触发click事件的代码
Nov 20 Javascript
jQuery及JS实现循环中暂停的方法
Feb 02 Javascript
jQuery查找节点并获取节点属性的方法
Sep 09 Javascript
JavaScript 是什么意思
Sep 22 Javascript
Vue开发过程中遇到的疑惑知识点总结
Jan 20 Javascript
Vue 2.0学习笔记之使用$refs访问Vue中的DOM
Dec 19 Javascript
JS获取指定月份的天数两种实现方法
Jun 22 Javascript
对angularJs中ng-style动态改变样式的实例讲解
Sep 30 Javascript
记一次Vue.js混入mixin的使用(分权限管理页面)
Apr 17 Javascript
详解vue高级特性
Jun 09 Javascript
vue组件vue-esign实现电子签名
Apr 21 Vue.js
基于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使用Cookie控制访问授权的方法
2015/01/21 PHP
阿里云PHP SMS短信服务验证码发送方法
2017/07/11 PHP
PHP 扩展Memcached命令用法实例总结
2020/06/04 PHP
比较详细的关于javascript 解析json的代码
2009/12/16 Javascript
jquery之超简单的div显示和隐藏特效demo(分享)
2013/07/09 Javascript
jQuery截取指定长度字符串的实现原理及代码
2014/07/01 Javascript
js调试工具console.log()方法查看js代码的执行情况
2014/08/08 Javascript
js判断浏览器版本以及浏览器内核的方法
2015/01/20 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
js生成随机数的方法实例
2015/10/16 Javascript
继续学习javascript闭包
2015/12/03 Javascript
JavaScript 定时器 SetTimeout之定时刷新窗口和关闭窗口(代码超简单)
2016/02/26 Javascript
使用JavaScript实现ajax的实例代码
2016/05/11 Javascript
jQuery图片轮播插件——前端开发必看
2016/05/31 Javascript
Bootstrap学习笔记之js组件(4)
2016/06/12 Javascript
JS弹出新窗口被拦截的解决方法
2016/08/09 Javascript
JS中split()用法(将字符串按指定符号分割成数组)
2016/10/24 Javascript
JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
2016/10/24 Javascript
AngularJS前端页面操作之用户修改密码功能示例
2017/03/27 Javascript
详解vue-cli之webpack3构建全面提速优化
2017/12/25 Javascript
jquery根据name取得select选中的值实例(超简单)
2018/01/25 jQuery
了解在JavaScript中将值转换为字符串的5种方法
2019/06/06 Javascript
Webpack中loader打包各种文件的方法实例
2019/09/03 Javascript
jQuery实现轮播图效果demo
2020/01/11 jQuery
Django1.9 加载通过ImageField上传的图片方法
2018/05/25 Python
Python中pandas dataframe删除一行或一列:drop函数详解
2018/07/03 Python
python SocketServer源码深入解读
2019/09/17 Python
深入了解Python 变量作用域
2020/07/24 Python
使用CSS3滤镜的filter:blur属性制作毛玻璃模糊效果的方法
2016/07/08 HTML / CSS
HTML5 canvas基本绘图之绘制五角星
2016/06/27 HTML / CSS
美丽的珠宝配饰:SmallThings
2019/09/04 全球购物
以下为Windows NT 下的32 位C++程序,请计算sizeof 的值
2016/12/07 面试题
求职简历自荐信
2013/10/20 职场文书
出国留学担保书
2014/05/20 职场文书
学生党员一帮一活动总结
2014/07/08 职场文书
2015年元旦文艺晚会总结(学院)
2014/11/28 职场文书