如何降低这种开关盒的复杂性?

时间:2019-10-21 02:55:28

标签: javascript code-complexity

在切换情况下,我有以下一个case,其中包含if else if语句。如何降低其复杂性?有什么简洁的方法可以重构此代码,将3分减少为1?

case 'glidepath':             ------->  +1 

   if (chartOptions.type === trp.fai.charts.glidepath.types.OVERVIEW) { --->+1
     trp.fai.charts.glidepath.drawOverview(chartOptions.data, $chart.attr('id'));   } 

else if (chartOptions.type === trp.fai.charts.glidepath.types.DETAILS) { -->+1
      trp.fai.charts.glidepath.drawDetails(chartOptions.data, $chart.attr('id'));

      break;
    }

3 个答案:

答案 0 :(得分:1)

将其拆分为多个功能。

case 'glidepath':
  drawTypes(type);
  break;
}
  // --- END FUNCTION ---------------


function drawTypes(type) {
  const {type, data} = chartOptions;
  const chart = $chart.attr('id');    
  cont {glidepath: {types,drawOverview},OVERVIEW,DETAILS} = trp.fai.charts;
  if (type === types.DETAILS) { // Put DETAILS first to break out earlier
      drawOverview(data, chart);
  } 
  else if (type === types.OVERVIEW) {
    drawDetails(data, chart);
  }
}

答案 1 :(得分:0)

case 'glidepath':      
  const { types, drawOverview, drawDetails } = trp.fai.charts.glidepath
  const id = $chart.attr('id')

  switch(chartOptions.type) {
    case types.OVERVIEW:
      drawOverview(chartOptions.data, id); 
      break;
    case types.DETAILS:
      drawDetails(chartOptions.data, id);
      break;
  }

编辑:根据您的评论,此处的目标是删除ifif elsecase语句。我认为这不会以任何方式改善代码,但是您可以这样做...

case 'glidepath':      
  const { types, drawOverview, drawDetails } = trp.fai.charts.glidepath
  const id = $chart.attr('id')
  const actions = {
    [types.OVERVIEW]: drawOverview,
    [types.DETAILS]: drawDetails
  }
  actions[chartOptions.type](chartOptions.data, id)

答案 2 :(得分:0)

使用基于变量而不是直接调用的约定怎么办?

您可以创建

chartHandlers: {
    glidepathDETAILS: function(data, id){ drawDetails(data, id); },

    glidepathOVERVIEW: function(data, id){  drawOverview(data, id); }

    invoke: function(switchKey, type, data, id){ this[switchKey + type.ToString()].apply(data, type); }
}

请注意,调用函数如何根据切换键的名称和图表类型来调用函数。

然后,您可以将整个交换机替换为一个呼叫。

chartHandlers.invoke(switchKey, chartOptions.type, chartOptions.data, $chart.attr('id'));

免责声明:我有一段时间没有用JS编程,也没有检查语法。这只是给您一个想法。对不起,可能是愚蠢的错误。