JavaScript设想形式进修—战略形式

什么是战略形式

战略形式,就是将差别的算法各自封装起来,然后依据顺序的差别状况,采纳差别的算法,有点像工场形式。比如在很多种状况下,都要写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得函数异常天真,原本能够当值通报,所以完成战略形式异常轻松,也很天真。

    原文作者:kaiten
    原文地址: https://segmentfault.com/a/1190000005992955
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞