JS策略模式《JavaScript設計模式與開發實踐》閱讀筆記

Amos 發布于2019-08-22 17:57 / 2231人閱讀

摘要：策略模式可以避免代碼中的多重判斷條件。策略模式在程序中或多或少的增加了策略類。此文僅記錄本人閱讀設計模式與開發實踐這個本時的感受，感謝作者曾探寫出這么好的一本書。設計模式中很重要的一點就是將不變和變分離出來。參考設計模式與開發實踐曾探

策略模式的定義是：定義一系列的算法，把它們一個個封裝起來，并且是它們可以相互替換。

策略模式可以避免代碼中的多重判斷條件。

策略模式很好的體現了開放-封閉原則，將一個個算法（解決方案）封裝在一個個策略類中。便于切換，理解，擴展。

策略中的各種算法可以重復利用在系統的各個地方，避免復制粘貼。

策略模式在程序中或多或少的增加了策略類。但比堆砌在業務邏輯中要清晰明了。

違反最少知識原則，必須要了解各種策略類，才能更好的在業務中應用。

此文僅記錄本人閱讀《JavaScript設計模式與開發實踐》這個本時的感受，感謝作者曾探寫出這么好的一本書。如有冒犯，如有錯誤，請聯系本人處理。

簡單的業務場景

計算員工年終獎需要根據不同的員工績效計算不同的獎金。例如，績效為S的人年終獎有4倍工資。績效A的人年終獎有3倍工資，績效B的人有2倍工資。

用代碼實現：

var calculateBonus = function(performanceLevel, salary) {
    if (performanceLevel === "S") {
        return salary * 4
    }
    if (performanceLevel === "A") {
        return salary * 3
    } 
    if (performanceLevel === "B") {
        return salary * 2
    }
}

calculateBonus("S", 2000) // 8000
calculateBonus("A", 2000) // 6000

其實上面一段代碼已經能應付目前的場景。但是，當獎金的評定需要增加一個績效C，或者改變績效A的計算方式。此時需要更改上面這個calculateBonus方法的內部結構，如此下去，這個方法內部將變得冗雜。

設計模式中很重要的一點就是將不變和變分離出來。這里變的是怎么算。不變的是根據一個績效獲得一個結果。所以上述代碼重寫，把各種算法封裝在一個個策略類中(傳統面向對象的模仿)：

var performanceS = function() {}
performanceS.prototype.calc = function(salary) {
    return salary * 4
}

var performanceA = function() {}
performanceA.prototype.calc = function(salary) {
    return salary * 3
}

var performanceB = function() {}
performanceB.prototype.calc = function(salary) {
    return salary * 2
}

//獎金類Bonus
var Bonus = function() {
    this.salary = null //原始工資
    this.strategy = null // 績效等級對應的策略對象
}

Bonus.prototype.setSalary = function(salary) {
    this.salary = salary //設置工資
}

Bonus.prototype.setStrategy = function(strategy) {
    this.strategy = strategy //設置員工績效對應的策略對象
}

Bonus.prototype.getBonus = function() { //獲取獎金數額
    return this.strategy.calc(this.salary) //把計算獎金的操作委托個對應的策略對象
}

var bonus = new Bonus()
bonus.setSalary(10000)
bonus.setStrategy(new performanceA())

console.log(bonus.getBonus()) // 30000

JavaScript版本的策略模式

在JavaScript中可以將一個個策略類寫成函數，然后封裝在對象中：

// 計算獎金的例子
var strategies = {
    S: function(salary) {
        return salary * 4
    },
    A: function(salary) {
        return salary * 3
    },
    B: function(salary) {
        return salary * 2
    }
}

var calculateBonus = function(level, salary) {
    return strategies[level](salary)
}

console.log(calculateBonus("S", 10000)) // 40000
console.log(calculateBonus("S", 20000)) // 80000

更廣義的“算法”

策略模式指的是一系列的算法（策略），并且把它們封裝起來。計算獎金的列子中就封裝了一些算法。其實世紀業務中也可以利用策略模式來封裝一些“業務規則”。

表單驗證

在Web項目中往往有很多場景需要提交表單。前端在把數據提交到后端之前，需要進行一波表單驗證，來減少不必要的網絡請求。在表單驗證中往往會有多種校驗規則，頁面中可能會有多個表單要進行驗證。此時可以用策略模式來實現一個表單驗證：


  輸入用戶名： 
  輸入密碼： 
  輸入手機號碼：

總結

在日常開發中一些工具函數可以封裝在一起，組成自己的工具庫。減少不必要的代碼復制粘貼。

感覺敲代碼思想更重要啦，這里策略模式體現了開放-封閉原則降低代碼的耦合度。這些理念都是我自己在敲代碼的路上要慢慢學習和積累的。

敲出來的代碼不能只有自己認識。要多注意細節，時刻去想哪些代碼可以再多完善。

當然不是所有的東西都要分來分去，一個簡單的需求為了設計模式而去設計模式也是不可取的。

love & peace

參考

《JavaScript設計模式與開發實踐》—— 曾探

GPU云服務器云服務器設計模式學習筆記策略模式策略者模式 head-first設計模式筆記

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/95346.html

JS迭代器模式《JavaScript設計模式與開發實踐》閱讀筆記

摘要：但實際中，內部迭代器和外部迭代器兩者并無優劣。迭代器并不只迭代數組迭代器模式不僅能迭代數組，還可以迭代一些類數組對象。晚安了，參考設計模式與開發實踐曾探本文作者本文鏈接迭代器模式設計模式與開發實踐閱讀筆記迭代器模式：一個相對簡單的模式，目前絕大多數語言都內置了迭代器，以至于大家都不覺得這是一種設計模式迭代器模式迭代器模式指提供一種方法訪問一個聚合對象中的各個元素，而又不需要暴露該...

djfml 2019-08-23 10:43 評論0 收藏0
JS代理模式《JavaScript設計模式與開發實踐》閱讀筆記

摘要：保護代理和虛擬代理保護代理當有許多需求要向某對象發出一些請求時，可以設置保護代理，通過一些條件判斷對請求進行過濾。虛擬代理在程序中可以能有一些代價昂貴的操作。而虛擬代理是最常用的一種代理模式。代理模式代理模式是為一個對象提供一個代用品或占位符，以便控制對它的訪問。保護代理和虛擬代理保護代理：當有許多需求要向某對象發出一些請求時，可以設置保護代理，通過一些條件判斷對請求進行過濾。...

mist14 2019-08-22 17:57 評論0 收藏0
某熊的技術之路指北 ?

某熊的技術之路指北 ? 當我們站在技術之路的原點，未來可能充滿了迷茫，也存在著很多不同的可能；我們可能成為 Web/(大)前端/終端工程師、服務端架構工程師、測試/運維/安全工程師等質量保障、可用性保障相關的工程師、大數據/云計算/虛擬化工程師、算法工程師、產品經理等等某個或者某幾個角色。某熊的技術之路系列文章/書籍/視頻/代碼即是筆者蹣跚行進于這條路上的點滴印記，包含了筆者作為程序員的技術視野、...

shadowbook 2019-06-25 19:06 評論0 收藏0
《JavaScript設計模式與開發實踐》讀書筆記

摘要：訂閱模式的一個典型的應用就是后面會寫一篇相關的讀書筆記。享元模式享元模式的核心思想是對象復用，減少對象數量，減少內存開銷。適配器模式對目標函數進行數據參數轉化，使其符合目標函數所需要的格式。設計模式單例模式 JS的單例模式有別于傳統面向對象語言的單例模式，js作為一門無類的語言。使用全局變量的模式來實現單例模式思想。js里面的單例又分為普通單例和惰性單例，惰性單例指的是只有這個實例...

Panda 2019-08-23 11:58 評論0 收藏0