JavaScript实现策略模式

  在开篇之前先分享今天看到的一句关于设计模式的话:将不变的部分和变化的部分隔开是每个设计模式的主题

  请大家自行感受这句话的精髓所在,并且思考学习设计模式究竟能给我们编程带来什么样的东西,欢迎大家在文章下面评(chui)论(shui),分享自己的宝贵见解。好了,回到今天的正题,JavaScript实现策略模式。

什么是策略模式

  定义一系列的算法,把它们一个个封装起来,并且使它们可以相互转换。讲人话就是:我想去旅游,那么我可以选择不同的方法(策略)去达到我的目的——旅游。比如说坐飞机,走路,甚至是小黄车ofo都行,这看你具体是怎么选择。如果你想快一点,那就选择坐飞机,如果你有梦想,那就选择走路,不管你选择什么,最后你都能达到相同的目的——旅游。

策略模式思想

   接合上面的例子和开篇第一句话,在策略模式中,不变的是我们的目的——旅游,而变化的部分是我们的去的方式(坐飞机,走路,ofo),所以我们就要把这两部分隔开以实现解耦。也就是策略模式的目的所在。为了比较策略模式带来的好处,我先用一般的方式完成我上面的例子。请看代码:

 var travel = function(transportation, destination) {
        if(transportation == ‘plane‘) {
            console.log("乘坐飞机到" + destination + "啦");
        }

        if(transportation == ‘foot‘) {
            console.log("走路到" + destination + "啦");
        }

        if(transportation == ‘ofo‘) {
            console.log("骑小黄车到" + destination + "啦");
        }
    }

    travel("foot", "北京"); //控制台打印:走路到北京啦
    travel("ofo", "天堂");  //控制台打印:骑小黄车到天堂啦

  我们现在已经完成了旅游的代码,貌似不错哦。但是恕我直言,这就是一段辣鸡代码。嘻嘻,具体有如下原因:

  1、travel函数包含了很多if语句,这些语句需要覆盖所有的逻辑分支

  2、travel函数缺乏弹性,如果现在又多了一种交通工具小蓝车,我们就必须修改travel函数源代码,这不科学!属实是违反了开放-封闭原则。

  现在我们使用策略模式来优化这段代码,请看下面代码:

   var strategies = {
        plane: function (destination) {
            console.log("乘坐飞机到" + destination + "啦");
        },
        foot: function (destination) {
            console.log("走路到" + destination + "啦");
        },
        ofo: function (destination) {
            console.log("骑小黄车到" + destination + "啦")
        }
    }

    var travel = function (transportation, destination) {
          strategies[transportation](destination);
    }

    travel("foot", "北京");
    travel("ofo", "天堂");

执行结果如下:

  可以看到我们通过策略模式完成了我们的需求,并且如果以后多了交通工具,管它是小黄车小白车还是小黑车,我们只用在策略对象strategies添加新的配置就可以了,而不用改动我们的travel函数。

  再次回顾开篇第一句话:将不变的部分和变化的部分隔开是每个设计模式的主题

  结合我们的策略模式思考,策略模式不变的部分就是目的(上例旅游),变化的部分就是过程(交通工具和目的地)。通过策略模式我们把这两部分彻底解耦,我们的过程(strategies)变化了也不会影响到我们的目的(travel)。我认为这就是策略模式给我们带来的好处。

  

    

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "Songti SC"; color: #000000 }
span.s1 { }

时间: 2024-10-16 07:30:12

JavaScript实现策略模式的相关文章

[设计模式] javascript 之 策略模式

定义: 封装一系列的算法,使得他们之间可以相互替换,本模式使用算法独立于使用它的客户的变化. 说明:策略模式,是一种组织算法的模式,核心不在于算法,而在于组织一系列的算法,并且如何去使用它:策略模式作用在于,行为实现的不可预见,面对这样的一种变化,我们得思考如何使用程序好维跟扩展,并使得客户很好的使用算法的方式: 策略模式 使用要注意它 "变化" 的一面,策略模式就是来解决这个 变化 问题的. 比如商场买卖的价格或促销问题,如果不使用模式,就可能只是 把“所有”的情况用 if else

聚焦javascript的策略模式

?今天看到一篇很好的文章和大家分享一下: 定义: 封装一系列的算法,使得他们之间可以相互替换,本模式使用算法独立于使用它的客户的变化. 说明:策略模式,是一种组织算法的模式,核心不在于算法,而在于组织一系列的算法,并且如何去使用它:策略模式作用在于,行为实现的不可预见,面对这样的一种变化,我们得思考如何使用程序好维跟扩展,并使得客户很好的使用算法的方式: 策略模式 使用要注意它 "变化" 的一面,策略模式就是来解决这个 变化 问题的. 比如商场买卖的价格或促销问题,如果不使用模式,就可

ruby和javascript的策略模式

来自官方 策略模式定义了一系列的算法,并将每一个算法封装起来,而且使它们还可以相互替换.策略模式让算法独立于使用它的客户而独立变化. 结构图 ruby中的简单实现(代码来自<ruby设计模式>) # 根据鸭子模型, 没有让策略对象继承一个提供统一接口的基类 # 策略1 class HTMLFormatter def output_report title, text puts '<html>' puts ' <head>' puts ' <title>' +

JavaScript设计模式 策略模式

在现实中,我们到达一个地方,通常可以选择不同的方式,例如自行车,火车,汽车,飞机等. 在程序设计中,通常也会有这样的情况,实现一个功能有多个方案可以选择,比如一个压缩文件的程序,既可以选择zip算法,也可以选择gzip算法. 而这种情况,在设计模式中,称为策略模式. 策略模式的定义:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 例子: 很多公司的年终奖是根据员工的工资基数和年底绩效情况来方法的.如S级绩效为4倍工资,A级有3倍工资,B级有两倍工资. 在不使用策略模式的情况下,

JavaScript 模拟策略模式

/** * 模拟一个接口,其方法会抛出异常: */ function FlyInter () {} FlyInter.prototype.fly = function() { throw '实现这个接口'; }; /** * 实现一个fly noway的方法: */ function FlyNoWays() {} FlyNoWays.prototype.fly = function() { console.log('fly noways'); }; /** * 实现一个fly with Wing

JavaScript设计模式与开发实践---读书笔记(5) 策略模式

策略模式的定义是:定义一系列的算法,把它们一个个封转起来,并且使它们可以相互替换. JavaScript版本的策略模式: 奖金系统: var strategies = { "S": function(salary){ return salary*4; }, "A": function(salary){ return salary*3; }, "B": function(salary){ return salary*2; } }; var calc

理解javascript中的策略模式

策略模式的定义是:定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换. 使用策略模式的优点如下: 优点:1. 策略模式利用组合,委托等技术和思想,有效的避免很多if条件语句. 2. 策略模式提供了开放-封闭原则,使代码更容易理解和扩展. 3. 策略模式中的代码可以复用. 一:使用策略模式计算奖金: 下面的demo是我在书上看到的,但是没有关系,我们只是来理解下策略模式的使用而已,我们可以使用策略模式来计算奖金问题: 比如公司的年终奖是根据员工的工资和绩效来考核的,绩效为A的人,年终奖

深入理解JavaScript系列(33):设计模式之策略模式(转)

介绍 策略模式定义了算法家族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化不会影响到使用算法的客户. 正文 在理解策略模式之前,我们先来一个例子,一般情况下,如果我们要做数据合法性验证,很多时候都是按照swith语句来判断,但是这就带来几个问题,首先如果增加需求的话,我们还要再次修改这段代码以增加逻辑,而且在进行单元测试的时候也会越来越复杂,代码如下: validator = { validate: function (value, type) { switch (type) { c

JavaScript设计模式之策略模式(学习笔记)

在网上搜索“为什么MVC不是一种设计模式呢?”其中有解答:MVC其实是三个经典设计模式的演变:观察者模式(Observer).策略模式(Strategy).组合模式(Composite).所以我今天选择学习策略模式. 策略模式:定义了一系列家族算法,并对每一种算法单独封装起来,让算法之间可以相互替换,独立于使用算法的客户. 通常我并不会记得“牛顿第一定律”的具体内容,所以我也难保证我会对这个定义记得多久……用FE经常见到的东西来举个例子说明一下: $("div").animation(