一、定义
责任链模式：使多个对象都有机会处理请求，从而避免请求的发送者和接受者之间的耦合关系，将这些对象连成一条链，并沿着这条链传递该请求，直到有一个对象处理它为止。
二、示例
- 假设这么一个场景：
- 我们负责一个售卖手机的电商网站，经过分别缴纳500元定金和200元定金的两轮预定后，到了正式购买阶段。针对预定用户实行优惠，支付过500元定金的用户会收到100元的商城优惠券，支付过200元定金的用户会收到50元的商城优惠券，没有支付定金的用户归为普通购买，且在库存有限的情况下不一定保证买到。
/* 传统方式实现 */
// orderType：[1:500, 2:200, 3:普通]，isPaid：true/false，stock：库存量
var order = function(orderType, isPaid, stock) {
if(orderType === 1) {
if(isPaid) {
console.log("500元定金预购，得到100优惠券");
} else {
if(stock > 0) {
console.log("普通购买，无优惠券");
}else {
console.log("库存不足");
}
}
}else if(orderType === 2) {
if(isPaid) {
console.log("200元定金预购，得到50优惠券");
} else {
if(stock > 0) {
console.log("普通购买，无优惠券");
}else {
console.log("库存不足");
}
}
}else if(orderType === 2) {
if(stock > 0) {
console.log("普通购买，无优惠券");
}else {
console.log("库存不足");
}
}
}
order(1, true, 500);
/*职责链 */
var order500 = function(orderType, isPaid, stock) {
if(orderType === 1 && isPaid === true) {
console.log("500元定金预购，得到100优惠券");
}else {
return "nextSuccessor";
}
};
var order200 = function(orderType, isPaid, stock) {
if(orderType === 2 && isPaid === true) {
console.log("200元定金预购，得到50优惠券");
}else {
return "nextSuccessor";
}
};
var orderNormal = function(orderType, isPaid, stock) {
if(stock > 0) {
console.log("普通购买，无优惠券");
}else {
console.log("库存不足");
}
};
Function.prototype.after = function(fn) {
var self = this;
return function() {
var ret = self.apply(this, arguments);
if(ret === "nextSuccessor") {
return fn.apply(this, arguments);
}
return ret;
};
}
var order = order500.after(order200).after(orderNormal);
order(1, true, 10);
优点：解耦了请求发送者和N个接受者之间的复杂关系。
弊端：不能保证某个请求一定会被链中的节点处理。
三、示例：文件上传对象
示例2：用责任链模式获取文件上传对象
PS：对比《学习JavaScript设计模式之迭代器模式》
function getActiveUploadObj() {
try{
return new ActiveObject("TXFTNActiveX.FTNUpload"); // IE上传控件
}catch(e) {
return "nextSuccessor";
}
}
function getFlashUploadObj() {
if(supportFlash().f === 1) { // supportFlash见《JavaScript设计模式--迭代器模式》
var str = '<object type="application/x-shockwave-flash"></object>';
return $(str).appendTo($("body"));
}
return "nextSuccessor";
}
function getFormUploadObj() {
var str = '<input name="file" type="file" class="ui-file" />';
return $(str).appendTo($("body"));
}
var getUploadObj = getActiveUploadObj.after(getFlashUploadObj).after(getFormUploadObj);
console.log(getUploadObj());
无论是作用域链、原型链、还是DOM节点中的事件冒泡，我们都能从中找到职责链的影子。
以上就是本文的全部内容，希望本文所述对大家学习javascript程序设计有所帮助。。
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！
如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
狼山资源网 Copyright www.pvsay.com
暂无“学习JavaScript设计模式之责任链模式”评论...
P70系列延期，华为新旗舰将在下月发布
3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。
而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。