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 相关文章推荐
使用命令对象代替switch语句的写法示例
Feb 28 Javascript
基于jQuey实现鼠标滑过变色(整行变色)
Dec 07 Javascript
jQuery实现textarea自动增长宽高的方法
Dec 18 Javascript
JavaScript设计模式经典之命令模式
Feb 24 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
Jun 12 Javascript
JS实现屏蔽网页右键复制及ctrl+c复制的方法【2种方法】
Sep 04 Javascript
微信小程序版翻牌小游戏
Jan 26 Javascript
JavaScript基于对象方法实现数组去重及排序操作示例
Jul 10 Javascript
你应该了解的JavaScript Array.map()五种用途小结
Nov 14 Javascript
详解puppeteer使用代理
Dec 27 Javascript
一文了解Vue中的nextTick
May 06 Javascript
layui实现鼠标移动到单元格上显示数据的方法
Sep 11 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
介绍几个array库的新函数 php
2006/12/29 PHP
php获取url字符串截取路径的文件名和扩展名的函数
2010/01/22 PHP
thinkPHP中配置的读取与C方法详解
2016/12/05 PHP
laravel框架模型、视图与控制器简单操作示例
2019/10/10 PHP
PHP 实现 JSON 数据的编码和解码操作详解
2020/04/22 PHP
用JAVASCRIPT如何给<textarea></textarea>赋值
2007/04/20 Javascript
asp(javascript)全角半角转换代码 dbc2sbc
2009/08/06 Javascript
js中如何复制一个对象并获取其所有属性和属性对应的值
2013/10/24 Javascript
js在数组中删除重复的元素自保留一个(两种实现思路)
2014/08/22 Javascript
JavaScript中常见的字符串操作函数及用法汇总
2015/05/04 Javascript
基于Vue如何封装分页组件
2016/12/16 Javascript
Vue.js开发环境快速搭建教程
2017/03/17 Javascript
jQuery中table数据的值拷贝和拆分
2017/03/19 Javascript
JS判断两个对象内容是否相等的方法示例
2017/04/10 Javascript
jQuery判断邮箱格式对错实例代码讲解
2017/04/12 jQuery
快速解决vue-cli不能初始化webpack模板的问题
2018/03/20 Javascript
vue中created和mounted的区别浅析
2019/08/13 Javascript
JavaScript实现跟随鼠标移动的盒子
2021/01/28 Javascript
[19:54]夜魇凡尔赛茶话会 第一期02:看图识人
2021/03/11 DOTA
使用python爬虫获取黄金价格的核心代码
2018/06/13 Python
Python爬虫之正则表达式的使用教程详解
2018/10/25 Python
Python中查看变量的类型内存地址所占字节的大小
2019/06/26 Python
python如何实现数据的线性拟合
2019/07/19 Python
详解pyinstaller selenium python3 chrome打包问题
2019/10/18 Python
tensorflow保持每次训练结果一致的简单实现
2020/02/17 Python
使用Pyhton 分析酒店针孔摄像头
2020/03/04 Python
Matlab中plot基本用法的具体使用
2020/07/17 Python
详解numpy.ndarray.reshape()函数的参数问题
2020/10/13 Python
pycharm 如何取消连按两下shift出现的全局搜索
2021/01/15 Python
美国中西部家用医疗设备商店:Med Mart(轮椅、踏板车、升降机等)
2019/04/26 全球购物
会计师职业生涯规划范文
2014/02/18 职场文书
公司承诺书格式
2014/05/21 职场文书
车间核算员岗位职责
2014/07/01 职场文书
初中生旷课检讨书范文
2014/10/06 职场文书
mysql中varchar类型的日期进行比较、排序等操作的实现
2021/11/17 MySQL
彻底弄懂Python中的回调函数(callback)
2022/06/25 Python