JavaScript设计模式学习—策略模式

snifes 发布于2019-08-21 14:06 / 1526人阅读

摘要：什么是策略模式策略模式，就是将不同的算法各自封装起来，然后根据程序的不同情况，采用不同的算法，有点像工厂模式。在其他语言中，实现这样的思路也比较费劲，而得函数非常灵活，本来可以当值传递，所以实现策略模式非常轻松，也很灵活。

什么是策略模式

策略模式，就是将不同的算法各自封装起来，然后根据程序的不同情况，采用不同的算法，有点像工厂模式。比如在很多种情况下，都要写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命令模式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/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