JS设计模式之命令模式概念与用法分析


Posted in Javascript onFebruary 06, 2018

本文实例讲述了JS设计模式之命令模式概念与用法。分享给大家供大家参考,具体如下:

客户创建命令;调用者执行该命令;接收者在命令执行时执行相应操作
简单命令对象一般用来消除二个对象(调用者和接收者)之间的耦合,而复杂的命令对象则一般用来封装不可分的或事务性的指令。

命令模式的主要用途是把调用对象(用户界面、API和代理等)与实现操作的对象隔离开。凡是两个对象间互动方式需要有更高的模块化程度时都可以用到这种模式。

命令的意思是用一个简单方法或函数去执行和这个命令相关的实际操作。就如同用遥控器打开电视一样,只按一个按键就可以打开电视,简单、方便。它具体的实现操作我们不用关心。那是有电视器来处理的。电视对遥控器提供了一个接口(信号),遥控器只需要在点击时实现这个接口就可以了。

JS设计模式之命令模式概念与用法分析

Command:
定义命令的接口,声明执行的方法。
ConcreteCommand:
命令接口实现对象,是“虚”的实现;通常会持有接收者,并调用接收者的功能来完成命令要执行的操作。
Receiver:
接收者,真正执行命令的对象。任何类都可能成为一个接收者,只要它能够实现命令要求实现的相应功能。
Invoker:
要求命令对象执行请求,通常会持有命令对象,可以持有很多的命令对象。这个是客户端真正触发命令并要求命令执行相应操作的地方,也就是说相当于使用命令对象的入口。
Client:
创建具体的命令对象,并且设置命令对象的接收者。注意这个不是我们常规意义上的客户端,而是在组装命令对象和接收者,或许,把这个Client称为装配者会更好理解,因为真正使用命令的客户端是从Invoker来触发执行

模式分析

1.命令模式的本质是对命令进行封装,将发出命令的责任和执行命令的责任分割开。
2.每一个命令都是一个操作:请求的一方发出请求,要求执行一个操作;接收的一方收到请求,并执行操作。
3.命令模式允许请求的一方和接收的一方独立开来,使得请求的一方不必知道接收请求的一方的接口,更不必知道请求是怎么被接收,以及操作是否被执行、何时被执行,以及是怎么被执行的。
4.命令模式使请求本身成为一个对象,这个对象和其他对象一样可以被存储和传递。
5.命令模式的关键在于引入了抽象命令接口,且发送者针对抽象命令接口编程,只有实现了抽象命令接口的具体命令才能与接收者相关联。

模式优点

1.降低对象之间的耦合度。
2.新的命令可以很容易地加入到系统中。
3.可以比较容易地设计一个组合命令。
4.调用同一方法实现不同的功能

// 命令
var CreateCommand = function( receiver ){
 this.receiver = receiver;
}
CreateCommand.prototype.execute = function() {
 this.receiver.action();
}
// 接收者 电视
var TVOn = function() {}
TVOn.prototype.action = function() {
  alert("TVOn");
}
// 接收者 电视
var TVOff = function() {}
TVOff.prototype.action = function() {
  alert("TVOff");
}
// 调用者 遥控器
var Invoker = function( tvOnCommand, tvOffCommand ) {
  this.tvOnCommand = tvOnCommand;
  this.tvOffCommand = tvOffCommand;
}
Invoker.prototype.tvOn = function() {
  this.tvOnCommand.execute();
}
Invoker.prototype.tvOff = function() {
  this.tvOffCommand.execute();
}

执行Client

var tvOnCommand = new CreateCommand( new TVOn() );
var tvOffCommand = new CreateCommand( new TVOff() );
var invoker = new Invoker( tvOnCommand, tvOffCommand );
invoker.tvOn();
invoker.tvOff();

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

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

Javascript 相关文章推荐
JavaScript中的匀速运动和变速(缓冲)运动详细介绍
Nov 11 Javascript
IE8下String的Trim()方法失效的解决方法
Nov 08 Javascript
jQuery的context属性用法实例
Dec 27 Javascript
jQuery实现的登录浮动框效果代码
Sep 26 Javascript
DOM操作和jQuery实现选项移动操作的简单实例
Jun 07 Javascript
关于javascript事件响应的基础语法总结(必看篇)
Dec 26 Javascript
js实现文字无缝向上滚动
Feb 16 Javascript
Vue2.0 UI框架ElementUI使用方法详解
Apr 14 Javascript
bootstrap3-dialog-master模态框使用详解
Aug 22 Javascript
基于vue2实现左滑删除功能
Nov 28 Javascript
详解vue 数组和对象渲染问题
Sep 21 Javascript
详解nvm管理多版本node踩坑
Jul 26 Javascript
使用selenium抓取淘宝的商品信息实例
Feb 06 #Javascript
vue一个页面实现音乐播放器的示例
Feb 06 #Javascript
使用百度地图实现地图网格的示例
Feb 06 #Javascript
js中的闭包学习心得
Feb 06 #Javascript
JS基于设计模式中的单例模式(Singleton)实现封装对数据增删改查功能
Feb 06 #Javascript
Vue仿今日头条实例详解
Feb 06 #Javascript
electron demo项目npm install安装失败的解决方法
Feb 06 #Javascript
You might like
PHP上传图片进行等比缩放可增加水印功能
2014/01/13 PHP
PHP5中实现多态的两种方法实例分享
2014/04/21 PHP
在IE下:float属性会影响offsetTop的取值
2006/12/22 Javascript
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果
2013/06/27 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
2015/03/26 Javascript
JS实现网页游戏中滑块响应鼠标点击移动效果
2015/10/19 Javascript
Node.js 日志处理模块log4js
2016/08/28 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
2016/11/23 Javascript
vue对storejs获取的数据进行处理时遇到的几种问题小结
2018/03/20 Javascript
微信小程序如何实现全局重新加载
2019/06/05 Javascript
微信小程序使用canvas自适应屏幕画海报并保存图片功能
2019/07/25 Javascript
微信小程序前端promise封装代码实例
2019/08/24 Javascript
jquery实现垂直手风琴菜单
2020/03/04 jQuery
vue自定义组件(通过Vue.use()来使用)即install的用法说明
2020/08/11 Javascript
jquery实现淡入淡出轮播图效果
2020/12/13 jQuery
[53:13]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS LGD-GAMING
2014/05/22 DOTA
[05:31]干嘛呢兄弟!DOTA2 TI9语音轮盘部分出处
2019/05/14 DOTA
Python中for循环和while循环的基本使用方法
2015/08/21 Python
Python探索之URL Dispatcher实例详解
2017/10/28 Python
CentOS7.3编译安装Python3.6.2的方法
2018/01/22 Python
PyQt5每天必学之日历控件QCalendarWidget
2018/04/19 Python
Python中pandas模块DataFrame创建方法示例
2018/06/20 Python
python3转换code128条形码的方法
2019/04/17 Python
Django MEDIA的配置及用法详解
2019/07/25 Python
Python实现钉钉订阅消息功能
2020/01/14 Python
Mac中PyCharm配置Anaconda环境的方法
2020/03/04 Python
Python如何用wx模块创建文本编辑器
2020/06/07 Python
Python3合并两个有序数组代码实例
2020/08/11 Python
美团网旗下网上订餐平台:美团外卖
2020/03/05 全球购物
Super-Pharm波兰:药房和香水在一个地方
2020/08/18 全球购物
承诺书怎么写
2014/03/26 职场文书
支行行长竞聘演讲稿
2014/05/15 职场文书
2014年城市管理工作总结
2014/12/02 职场文书
社团个人总结范文
2015/03/05 职场文书
主持人开场白台词
2015/05/29 职场文书
工作证明书
2015/06/15 职场文书