策略模式
概念
- 不同策略分開處理
- 避免出現(xiàn)大量 if...else 或者 switch...case
演示
未使用策略模式的時候代碼是這個樣子的
class User {
constructor (type) {
this.type = type;
}
buy() {
if(this.type === "ordinary") {
console.log("普通用戶購買");
} else if(this.type === "member") {
console.log("會員用戶購買");
}else if(this.type === "VIP") {
console.log("VIP用戶購買");
}
}
}
// 測試代碼
let u1 = new User('ordinary')
u1.buy()
let u2 = new User('member')
u1.buy()
let u3 = new User('VIP')
u1.buy()
使用策略模式的代碼
class OridnaryUser {
buy() {
console.log("普通用戶購買")
}
}
class MemberUser {
buy() {
console.log("會員用戶購買")
}
}
class VipUser {
buy() {
console.log("VIP用戶購買")
}
}
let u1 = new OridnaryUser();
let u2 = new MemberUser();
let u3 = new VipUser();
設(shè)計原則驗證
- 不同策略,分開處理祝闻,而不是混合在一起
- 符合開放封閉原則
模板方法模式
什么是模板方法占卧?
一個方法代碼太多,我們可以拆分開來联喘,或者組合其他的方法一起執(zhí)行
可以通過一個方法华蜒,對自己內(nèi)部的一些相關(guān)順序執(zhí)行方法進(jìn)行一個合并,對外輸出一個統(tǒng)一的方法豁遭。
簡單用代碼演示
class Action {
handle() {
handle1();
handle2();
handle3();
}
handle1() {
console.log(1)
}
handle2() {
console.log(2)
}
handle3() {
console.log(3)
}
}
職責(zé)鏈模式
概念
- 異步操作可能分為多個職責(zé)角色來完成
- 把這些角色都分開叭喜,然后用一個鏈串起來
- 將發(fā)起者和各個處理者進(jìn)行隔離
代碼演示
比如你需要請假,需要各個審批蓖谢,一級一級的審批捂蕴,代碼如下
class Action {
constructor(name) {
this.name = name;
this.nextAction = null;
}
setNextAction(action) {
this.nextAction = action;
}
handle() {
console.log(`${this.name} 審批`)
if(this.nextAction !== null){
this.nextAction.handle();
}
}
}
// 測試
let a1 = new Action("組長");
let a2 = new Action("經(jīng)理");
let a3 = new Action("總監(jiān)");
a1.setNextAction(a2);
a2.setNextAction(a3);
a1.handle();
運(yùn)行結(jié)果
運(yùn)行結(jié)果.png
JS中的鏈?zhǔn)讲僮?/h5>
- 職責(zé)鏈模式和業(yè)務(wù)結(jié)合較多,JS中能夠聯(lián)想到鏈?zhǔn)讲僮?/li>
- Jquery的鏈?zhǔn)讲僮鳎?Promise.then的鏈?zhǔn)讲僮?/li>
設(shè)計原則驗證
- 發(fā)起者于各個處理者進(jìn)行隔離
- 符合開放封閉原則
本文資料來自慕課網(wǎng)-雙越老師-Javascript 設(shè)計模式系統(tǒng)講解與應(yīng)用視頻課程
本文資料來自慕課網(wǎng)-雙越老師-Javascript 設(shè)計模式系統(tǒng)講解與應(yīng)用視頻課程