【JS设计模式】责任链模式的代码示例
2016-06-07 10:39
661 查看
责任链设计模式:
在责任链模式里,很多对象由每一个对象对其下家的引用而连接起来形成一条链。请求在这个链上传递,直到链上的某一个对象决定处理此请求。发出这个请求的客户端并不知道链上的哪一个对象最终处理这个请求,这使得系统可以在不影响客户端的情况下动态地重新组织和分配责任。
责任链模式涉及到的角色如下所示:
● 抽象处理者(Handler)角色:定义出一个处理请求的接口。如果需要,接口可以定义 出一个方法以设定和返回对下家的引用。这个角色通常由一个Java抽象类或者Java接口实现。上图中Handler类的聚合关系给出了具体子类对下家的引用,抽象方法handleRequest()规范了子类处理请求的操作。
● 具体处理者(ConcreteHandler)角色:具体处理者接到请求后,可以选择将请求处理掉,或者将请求传给下家。由于具体处理者持有对下家的引用,因此,如果需要,具体处理者可以访问下家。
在JS(ES6之前)中严格意义上是没有extends继承概念,所以以下代码没有模拟抽象类,代码中只实现了具体处理类.
使用场景:在一个购物商城,在五一做了一个活动,所以图书类商品根据购买的金额依次做出以下折扣方案,
1、购买满199元,打9折
2、购买满399元,打8折
3、购买满599元以上,打7折;
责任链链的优点:
请求发送者只需要知道链中的第一个节点,从而弱化了发送者和一组接收者之间的强联系。如果不使用责任链链模式、根据当前价格客户端要知道每一级打折信息,最后知道具体是那一层上打折才是符合当前价格的折扣。
客户端 :
Console.log打印出来的效果:
在责任链模式里,很多对象由每一个对象对其下家的引用而连接起来形成一条链。请求在这个链上传递,直到链上的某一个对象决定处理此请求。发出这个请求的客户端并不知道链上的哪一个对象最终处理这个请求,这使得系统可以在不影响客户端的情况下动态地重新组织和分配责任。
责任链模式涉及到的角色如下所示:
● 抽象处理者(Handler)角色:定义出一个处理请求的接口。如果需要,接口可以定义 出一个方法以设定和返回对下家的引用。这个角色通常由一个Java抽象类或者Java接口实现。上图中Handler类的聚合关系给出了具体子类对下家的引用,抽象方法handleRequest()规范了子类处理请求的操作。
● 具体处理者(ConcreteHandler)角色:具体处理者接到请求后,可以选择将请求处理掉,或者将请求传给下家。由于具体处理者持有对下家的引用,因此,如果需要,具体处理者可以访问下家。
在JS(ES6之前)中严格意义上是没有extends继承概念,所以以下代码没有模拟抽象类,代码中只实现了具体处理类.
使用场景:在一个购物商城,在五一做了一个活动,所以图书类商品根据购买的金额依次做出以下折扣方案,
1、购买满199元,打9折
2、购买满399元,打8折
3、购买满599元以上,打7折;
责任链链的优点:
请求发送者只需要知道链中的第一个节点,从而弱化了发送者和一组接收者之间的强联系。如果不使用责任链链模式、根据当前价格客户端要知道每一级打折信息,最后知道具体是那一层上打折才是符合当前价格的折扣。
function BookHandler() { this.calcPrice = function( price ) { if ( 199 > price ) { console.log("原价是:"+ price); } else { this.successor.calcPrice( price ); } } this.setSuccessor = function( _successor ) { this.successor = _successor; } } function BookCalc9Handler( _successor ) { this.calcPrice = function( price ) { if ( 199 <= price && price < 399 ) { console.log("原价是:"+ price +";打9折后:" + (price * 0.9)); } else { this.successor.calcPrice( price ); } } this.setSuccessor = function( _successor ) { this.successor = _successor; } } function BookCalc8Handler() { this.calcPrice = function( price ) { if ( 399 <= price && price < 599 ) { console.log("原价是:"+ price +";打8折后:" + (price * 0.8)); } else { this.successor.calcPrice( price ) } } this.setSuccessor = function( _successor ) { this.successor = _successor; } } function BookCalc7Handler() { this.calcPrice = function( price ) { if ( price >= 599 ) { console.log("原价是:"+ price +";打7折后:" + (price * 0.7)); } else { this.successor.calcPrice( price ) } } this.setSuccessor = function( _successor ) { this.successor = _successor; } }
客户端 :
var price = 400; var bookHandler = new BookHandler(); var bookCalc9Handler = new BookCalc9Handler(); var bookCalc8Handler = new BookCalc8Handler(); var bookCalc7Handler = new BookCalc7Handler(); bookHandler.setSuccessor(bookCalc9Handler); bookCalc9Handler.setSuccessor(bookCalc8Handler); bookCalc8Handler.setSuccessor(bookCalc7Handler); bookHandler.calcPrice(price);
Console.log打印出来的效果:
相关文章推荐
- 【转】JavaScript 正则表达式上——基本语法
- js拼字符串传action时 不要用#号拼接,用逗号
- javascript基础语法——表达式
- 客户端js判断文件类型和文件大小即限制上传大小
- JavaScript实现九九乘法表的简单实例
- javascript如何定义对象数组
- 在JavaScript中创建命名空间的几种写法
- js判断为空Null与字符串为空实例
- js判断输入的数据是否是正整数,包括100.00(100.000)
- JavaScript_compare_C++_部分类似处
- JSON对象遍历和处理
- 以.jsp和.html作为后缀的不同
- javascript函数作用域和嵌套调用关系
- ExtJs6 grid中根据返回数据结果动态添加checkcolumn组件
- js Date 获取 年 月 日 具体的值
- js中两种创建对象的方法
- javascript 数组的定义和数组的长度
- javascript之类型转换
- JSON is undefined. Infopath Form People Picker in SharePoint 2013
- js输入判断+图片预览js