JavaScript設計模式學習—策略模式

snifes 發布于2019-08-21 14:06 / 1533人閱讀

摘要：什么是策略模式策略模式，就是將不同的算法各自封裝起來，然后根據程序的不同情況，采用不同的算法，有點像工廠模式。在其他語言中，實現這樣的思路也比較費勁，而得函數非常靈活，本來可以當值傳遞，所以實現策略模式非常輕松，也很靈活。

什么是策略模式

策略模式，就是將不同的算法各自封裝起來，然后根據程序的不同情況，采用不同的算法，有點像工廠模式。比如在很多種情況下，都要寫ifXXX dosometing（） else if XXX，這是最基本的程序邏輯寫法，但隨著情況越來越復雜，那么代碼將非常難讀，混亂不堪。

策略模式實現

之前寫過的一個頁面就非常痛苦，是一個訂單頁加一些新功能，我是中途接手的，這個頁面大概的描述是根據不同的角色（用戶，商家，管理員）和不同的訂單狀態對頁面進行相應的DOM操作和提供不同的接口功能。之前情況不多，代碼也就是最簡單的if else，雖然丑陋了點，但也沒到不可讀的地步，但隨著訂單不同的status增加到十幾種，和夾雜一些訂單不同狀態轉換前的判斷，代碼就看起來不可控了。
我嘗試用策略模式重構代碼，先簡化一下，看看一種狀態下不同角色操作實現：

if(role == 1){
          $(".order_btn").text("查看訂單");
          checkOrder();
}else if(role == 2){
          $(".order_btn").text("發貨");
          deilverGoods();
}else if(role == 3){
          $(".order_btn").text("取消訂單");
          cancelOrder();
}

1代表用戶，2代表商家，3代表管理員，隨著角色不同，相應頁面按鈕進行不同處理，也相應調用不同的實現算法。
先嘗試將角色與操作對應封裝：

var performanceByRole={
    user:function(){
      $(".order_btn").text("查看訂單");
      checkOrder();
    },
    seller:function(){
      $(".order_btn").text("發貨");
      deilverGoods();
    },
    manage:function(){
     $(".order_btn").text("取消訂單");
      cancelOrder();
    }
};
function shiftRole(role){
    if(role == 1){
      return "user";
    }else if(role == 2){
      return "seller"
    }else if(role == 3){
      return "manage"
    };
}
function toDiffStrategy(role){
    var funcname = shiftRole(role);
    performanceByRole[funcname]();
}

var role = fromServer();
toDiffStrategy(role);

首先把要采取的不同策略封裝在一個鍵值對里，shiftRole這個函數是“多余的”，轉換一下后臺傳給前端的數據，這里即使用了if else也是可控的，因為角色就那么幾個，之后toDiffStrategy將根據傳入的不同角色，采取不同的策略算法。在其他語言中，實現這樣的思路也比較費勁，而js得函數非常靈活，本來可以當值傳遞，所以實現策略模式非常輕松，也很靈活。

GPU云服務器云服務器策略模式策略者模式 javascript設計模式 javascript命令模式

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

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

javascript設計模式學習筆記之策略模式

摘要：策略模式策略模式指的是定義一系列的算法，把它們一個個封裝起來，將不變的部分和變化的部分隔開，實際就是將算法的使用和實現分離出來這樣就能避免很多的條件判斷并且增強了代碼的復用性其中包含一個策略類和一個環境類計算獎金的例子策略類環境類設置原始工策略模式策略模式指的是定義一系列的算法，把它們一個個封裝起來，將不變的部分和變化的部分隔開，實際就是將算法的使用和實現分離出來, 這樣就能避...

wh469012917 2019-08-23 16:20 評論0 收藏0
JS策略模式《JavaScript設計模式與開發實踐》閱讀筆記

摘要：策略模式可以避免代碼中的多重判斷條件。策略模式在程序中或多或少的增加了策略類。此文僅記錄本人閱讀設計模式與開發實踐這個本時的感受，感謝作者曾探寫出這么好的一本書。設計模式中很重要的一點就是將不變和變分離出來。參考設計模式與開發實踐曾探策略模式的定義是：定義一系列的算法，把它們一個個封裝起來，并且是它們可以相互替換。策略模式可以避免代碼中的多重判斷條件。策略模式很好的體現了開放-...

Amos 2019-08-22 17:57 評論0 收藏0
JavaScript設計模式與開發實踐系列之策略模式

摘要：本系列為設計模式與開發實踐作者曾探學習總結，如想深入了解，請支持作者原版策略模式策略模式的定義定義一系列的算法，把它們一個個封裝起來，并且使它們可以互相替換。本系列為《JavaScript設計模式與開發實踐》（作者：曾探）學習總結，如想深入了解，請支持作者原版策略模式策略模式的定義：定義一系列的算法，把它們一個個封裝起來，并且使它們可以互相替換。舉個形象的例子，使用策略模式計算...

spademan 2019-08-19 17:48 評論0 收藏0
JavaScript 設計模式系列 - 策略模式與動態表單驗證

摘要：策略模式又稱政策模式，其定義一系列的算法，把它們一個個封裝起來，并且使它們可以互相替換。的表單具有表單驗證功能，用來校驗用戶輸入的表單內容。實際需求中表單驗證項一般會比較復雜，所以需要給每個表單項增加自定義校驗方法。 showImg(https://segmentfault.com/img/remote/1460000020135990); 策略模式（Strategy Pattern...

宋華 2019-08-26 14:06 評論0 收藏0
學習這些設計模式，讓你寫出更優雅的代碼

摘要：寫代碼容易，寫出優雅的代碼難，寫易于維護的容易擴展的結構清晰的代碼應該是每位開發者努力的目標，而學習設計模式，合理的的使用能讓我們離這個目標更進一步。寫代碼容易，寫出優雅的代碼難，寫易于維護的、容易擴展的、結構清晰的代碼應該是每位開發者努力的目標，而學習設計模式，合理的的使用能讓我們離這個目標更進一步。最近看了《Javascript設計模式與開發實踐》這本書,一言以蔽之，真不錯的一本...

songjz 2019-08-21 17:41 評論0 收藏0