解决代码中大量if/else

在编写 JS 代码时,经常会遇到逻辑判断复杂的情况。一般情况下,可以用 if/else 或 switch 来实现多个条件判断,但会出现一个问题:随着逻辑复杂度的增加,代码中的 if/else 和 switch 会越来越臃肿

  if (status == 1) {
    // 逻辑1
  } else if (status == 2) {
    // 逻辑2
  } else if (status == 3) {
    // 逻辑3
  } else if (status == 4) {
    // 逻辑4
  } else if (status == 5) {
    // 逻辑5
  } else {
    // 逻辑6
  }

很简单的就想到了用switch重写一下

switch (status) {
  case 1:
    // 逻辑1
    break
  case 2:
  case 3:
    // 逻辑3、2 两个相同的可以写一起
    break
  case 4:
    // 逻辑4
    break
  case 5:
   // 逻辑5
    break
  default:
    // 逻辑6
    break
}

这样判断多了的时候看着也揪心,推荐以下Map更好的方法

  const actions = new Map([ // Map键可以是任何类型的值
    [1, fn1], // 为1时执行fn1函数
    [2, fn2],
    [3, fn3],
    [4, fn4],
    [5, fn5],
    ['default', fn6],
  ])

  const onButtonClick = (status) => {
    let action = actions.get(status)
    action()
  }

  function fn1() {
    console.log(66666666)
  }
  // ............

  const sendLog = (status) => {
    console.log(status)
  }

  onButtonClick(1)

 

posted @ 2021-08-30 16:09  王小美丶  阅读(447)  评论(0编辑  收藏  举报