JavaScript设计模式之职责链模式应用示例


Posted in Javascript onAugust 07, 2018

本文实例讲述了JavaScript设计模式之职责链模式。分享给大家供大家参考,具体如下:

一、职责链的定义:

使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。

二、实例场景说明:

某公司对公司产品-手机进行促销活动,有以下政策:在正式购买时,已经支付过500元定金的用户会收到100元的商城优惠卷,交200元定金的用户可以收到50元的优惠卷,而之前没有支付定金的用户只能进入普通购买模式,也就是没有优惠卷,主要危险为在库存有限的情况下不一定能买到手机。

三、实例代码如下:

1、创建3中购买模式的函数对象,如下:

/**
* @param: orderType 表示订单类型
* @param: pay 表示用户是否已经支付定金
* @param: stock 表示当前用户普通购买的手机库存数量,交过定金的用户不受此限制
**/
var order500 = function( orderType, pay, stock ){
  if( orderType === 1 && pay === true)
     console.log('500元定金预购,得到100优惠卷');
  else
     return 'nextSuccessor'; //不知道下一个节点是谁,反正把请求往后面传递
};
var order200 = function( orderType, pay, stock){
  if( orderType === 2 && pay === true)
    console.log( '200元定金预购,得到50元优惠卷' );
  else
    return 'nextSuccessor';
};
var orderNormal = function(orderType, pay, stock){
  if(stock > 0)
    console.log('普通购买,无优惠卷');
  else
    console.log('手机库存不足');
};

2、书写一个把函数包装进职责链节点的构造函数,如下:

var Chain = function(fn){
  this.fn = fn;
  this.successor = null;
};
Chain.prototype.setNextSuccessor = function( successor ){
  return this.successor = successor;
};
Chain.prototype.passRequest = function(){
  var ret = this.fn.apply( this, arguments );
  if( ret === 'nextSuccessor'){
    return this.successor && this.successor.passRequest.apply( this,successor, arguments );
  }
   return ret;
};

3、调用如下:

1> 把3个订单函数分别包装成职责链的节点:

var chainOrder500 = new Chain( order500 );
var chainOrder200 = new Chain( order200 );
var chainOrderNormal = new Chain( orderNormal );

2> 指定节在职责链中的顺序:

chainOrder500.setNextSuccessor( chainOrder200 );
chainOrder200.setNextSuccessor( chainOrderNormal );

3> 把请求传递给第一个节点,如下:

chainOrder500.passRequest( 1, true, 500 ); //输出:500元定金预购,得到100优惠卷
chainOrder500.passRequest( 2, true, 500 ); //输出:200元定金预购,得到50优惠卷
chainOrder500.passRequest( 3, true, 500 ); //输出:普通购买,无优惠卷
chainOrder500.passRequest( 1, false, 0 ); //输出:手机库存不足

四、职责链模式优点:

通过上述代码,我们可以灵活的添加和删除节点,以及可灵活的修改节点的顺序。

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

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

Javascript 相关文章推荐
json简单介绍
Jun 10 Javascript
JQuery index()方法使用代码
Jun 02 Javascript
js实现照片墙功能实例
Feb 05 Javascript
javascript自动生成包含数字与字符的随机字符串
Feb 09 Javascript
JQuery操作元素的css样式
Mar 09 Javascript
jQuery实现html元素拖拽
Jul 21 Javascript
Angular和百度地图的结合实例代码
Oct 19 Javascript
简单理解vue中Props属性
Oct 27 Javascript
Bootstrap源码解读表单(2)
Dec 22 Javascript
canvas知识总结
Jan 25 Javascript
jQuery.Form上传文件操作
Feb 05 Javascript
Angularjs中ng-repeat的简单实例
Aug 25 Javascript
JavaScript使用享元模式实现文件上传优化操作示例
Aug 07 #Javascript
JavaScript设计模式之模板方法模式原理与用法示例
Aug 07 #Javascript
opencv 识别微信登录验证滑动块位置
Aug 07 #Javascript
JavaScript设计模式之缓存代理模式原理与简单用法示例
Aug 07 #Javascript
深入浅析var,let,const的异同点
Aug 07 #Javascript
springMvc 前端用json的方式向后台传递对象数组方法
Aug 07 #Javascript
JS实现中英文混合文字溢出友好截取功能
Aug 06 #Javascript
You might like
PHP简介
2006/10/09 PHP
ThinkPHP整合百度Ueditor图文教程
2014/10/21 PHP
因str_replace导致的注入问题总结
2019/08/08 PHP
Javascript 通过json自动生成Dom的代码
2010/04/01 Javascript
使用Jquery Aajx访问WCF服务(GET、POST、PUT、DELETE)
2012/03/16 Javascript
NodeJs中的非阻塞方法介绍
2012/06/05 NodeJs
node.js中的buffer.write方法使用说明
2014/12/10 Javascript
深入理解jQuery 事件处理
2016/06/14 Javascript
jQuery模拟窗口抖动效果
2017/03/15 Javascript
解决html input验证只能输入数字,不能输入其他的问题
2017/07/21 Javascript
原生JS实现的双色球功能示例
2018/02/02 Javascript
微信小程序实现日历功能
2018/11/27 Javascript
微信小程序时间控件picker view使用详解
2018/12/28 Javascript
解决ant design vue中树形控件defaultExpandAll设置无效的问题
2020/10/26 Javascript
[01:35]2018完美盛典章节片——共竞
2018/12/17 DOTA
[54:17]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第二场 1月10日
2021/03/11 DOTA
Python判断变量是否已经定义的方法
2014/08/18 Python
Python序列之list和tuple常用方法以及注意事项
2015/01/09 Python
Python中特殊函数集锦
2015/07/27 Python
python保存网页图片到本地的方法
2018/07/24 Python
python NumPy ndarray二维数组 按照行列求平均实例
2019/11/26 Python
TensorFlow梯度求解tf.gradients实例
2020/02/04 Python
python实现俄罗斯方块小游戏
2020/04/24 Python
Python3 pywin32模块安装的详细步骤
2020/05/26 Python
Python读写csv文件流程及异常解决
2020/10/20 Python
html5实现多图片预览上传及点击可拖拽控件
2018/03/15 HTML / CSS
在canvas上实现元素图片镜像翻转动画效果的方法
2018/03/20 HTML / CSS
AmazeUI 加载进度条的实现示例
2020/08/20 HTML / CSS
幼儿园教师个人反思
2014/01/30 职场文书
美术教师岗位职责
2014/03/18 职场文书
预备党员自我批评思想汇报
2014/10/10 职场文书
免职证明样本
2014/10/23 职场文书
水电工程师岗位职责
2015/02/13 职场文书
目标责任书格式范文
2015/05/11 职场文书
2016年中秋节寄语大全
2015/12/07 职场文书
导游词之塘栖古镇
2019/12/04 职场文书