標(biāo)簽: 前端 設(shè)計(jì)模式 職責(zé)鏈模式 typescript Chain of Responsibility
請(qǐng)仔細(xì)閱讀下面代碼,理解其中的設(shè)計(jì)理念。
職責(zé)鏈模式
職責(zé)鏈模式: 職責(zé)鏈模式是用來(lái)消除消息的請(qǐng)求者和處理者之間的耦合的模式壳坪,尤其是在處理者有多個(gè)的情況下医窿。
實(shí)際場(chǎng)景
逛淘寶我們時(shí)巢狙担可以看到消費(fèi)滿多少立減多少,滿的多減的多躯肌。
這種根據(jù)用戶消費(fèi)的情況有不同的打折機(jī)制就會(huì)用到職責(zé)鏈模式來(lái)解除消息發(fā)送者和處理者之間的耦合。
職責(zé)鏈模式的結(jié)構(gòu)
- Sender: 消息的發(fā)送者
- Handler的抽象類(lèi): 處理者的抽象類(lèi)或接口
- Handler: 各種處理者們
職責(zé)鏈模式的例子
現(xiàn)在有商場(chǎng)打折如下
普通折扣: 消費(fèi)不滿100元破衔,不打折
黃金折扣: 消費(fèi)滿100元清女,打9折
鉑金折扣: 消費(fèi)滿500元,打8折
鉆石折扣: 消費(fèi)滿1000元晰筛,打7折
我們用職責(zé)鏈模式
先定義抽象類(lèi)
/* handler-abstract-class.ts */
export abstract class HandlerAbstractClass {
protected name: string;
protected higherLevel: HandlerAbstractClass;
constructor (name: string) {
this.name = name;
}
public setHigherLevel (higherLever: HandlerAbstractClass) {
this.higherLevel = higherLever;
}
public abstract handlerMessage (money: number)
}
定義幾個(gè)等級(jí)
/* level-1.ts */
import { HandlerAbstractClass } from './handler-abstract-class';
export class Level1 extends HandlerAbstractClass {
public handlerMessage(money: number) {
if (money < 100) {
console.log(`您消費(fèi)${money}元嫡丙,當(dāng)前折扣為${this.name}折扣,還需支付${money}元`);
} else {
this.higherLevel.handlerMessage(money);
}
}
}
/* level-2.ts */
import { HandlerAbstractClass } from './handler-abstract-class';
export class Level2 extends HandlerAbstractClass {
public handlerMessage(money: number) {
if (money < 500) {
console.log(`您消費(fèi)${money}元读第,當(dāng)前折扣為${this.name}折扣曙博,還需支付${money * 0.8}元`);
} else {
this.higherLevel.handlerMessage(money);
}
}
}
/* level-3.ts */
import { HandlerAbstractClass } from './handler-abstract-class';
export class Level3 extends HandlerAbstractClass {
public handlerMessage (money: number) {
if (money < 1000) {
console.log(`您消費(fèi)${money}元,當(dāng)前折扣為${this.name}折扣卦方,還需支付${money * 0.7}元`);
} else {
this.higherLevel.handlerMessage(money);
}
}
}
/* level-4.ts */
import { HandlerAbstractClass } from './handler-abstract-class';
export class Level4 extends HandlerAbstractClass {
public handlerMessage(money: number) {
console.log(`您消費(fèi)${money}元羊瘩,當(dāng)前折扣為${this.name}折扣,還需支付${money * 0.6}元`);
}
}
客戶端調(diào)用
/* client.ts */
import { Level1 } from './level-1';
import { Level2 } from './level-2';
import { Level3 } from './level-3';
import { Level4 } from './level-4';
export class Client {
public static getDiscount(money: number) {
const level4 = new Level4('鉆石');
const level3 = new Level3('鉑金');
const level2 = new Level2('黃金');
const level1 = new Level1('普通');
level2.setHigherLevel(level3);
level1.setHigherLevel(level2);
level1.handlerMessage(money);
}
}
Client.getDiscount(1176);
職責(zé)鏈模式的利弊
利:
- 有效的解除消息的發(fā)送者和處理者之間的耦合盼砍,可以更容易的模塊化和重構(gòu)、修改處理邏輯逝她。
弊:
- 對(duì)象變多了之后浇坐,管理起來(lái)相對(duì)復(fù)雜了一點(diǎn)。
- 在職責(zé)鏈中無(wú)法保證他一定被處理黔宛。