JS使用策略模式优化条件选择结构

这段代码是采用if-else的方式判断多个不同的条件。

function permission(role){
    if(role === "operations"){
        getOperationPermission()
    }else if(role === "admin"){
        getAdminPermission()
    }else if(role === "superAdmin"){
        getSuperAdminPermission()
    }else if(role === "user"){
       getUserPermission() 
    }
}

用switch优化后为：

function permission(role) {
  switch (role) {
    case "operations": {
      getOperationPermission();
      break;
    }
    case "admin": {
      getAdminPermission();
      break;
    }
    case "superAdmin": {
      getSuperAdminPermission();
      break;
    }
    case "user": {
      getUserPermission();
      break;
    }
  }
}

这种写法虽然使代码清晰了许多，但是依旧不合格，接下来我们看看采用策略模式后的结果：

function permission(role) {
  const actions = {
    operations: getOperationPermission,
    admin: getAdminPermission,
    superAdmin: getSuperAdminPermission,
    user: getUserPermission,
  };
  actions[role].call();
}

比起前面两种写法，显然采用策略模式要更加优雅。

我们将策略模式用于修改生产的代码，

如将

switch (active.value) {
  case 0:
    getPendingApprovalList();
    break;
  case 1:
    getApprovedList();
    break;
  case 2:
    getExpiredList();
    break;
  case 3:
    getMyOrderList();
    break;
}

修改成

const queryFuncs = [
  getPendingApprovalList,
  getApprovedList,
  getExpiredList,
  getMyOrderList,
];
queryFuncs[active.value].call();

既精简了代码又使代码结构清晰。

策略模式的定义：定义一系列的算法，把他们一个个封装起来，并且使他们可以相互替换。

策略模式的目的就是将算法的使用和算法的实现分离开来。

 

策略模式调用传参示例：

const onSelect = (item, action) => {
  const strategies = {
    "配置关联表单": goRelatedForm,
    "配置紧后节点": goNextNodesList,
    "配置审批组": goApprovalGroupList,
    "设为通过节点": setFinalStatePass.bind(null,item,true),
    "取消设为通过节点": setFinalStatePass.bind(null,item, false),
    "配置规则": configProcessRule,
    "配置表单操作字段": configProcessLinkHandle,
    "清空审批人": delAllAssignees
  };

  const strategy = strategies[action.text];
  if (strategy) {
    strategy(item);
  }
};