三十亿少女的梦 阅读(124) 评论(0)

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

  请大家自行感受这句话的精髓所在,并且思考学习设计模式究竟能给我们编程带来什么样的东西,欢迎大家在文章下面评(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)。我认为这就是策略模式给我们带来的好处。