抽象配置

  1. //bad
  2. if (condition === 'a') {
  3.  doA()
  4. } else if (condotion === 'b') {
  5.     doB()
  6. } else if ...
  9. //good
  10. const CONDITIONS = {
  11.  a: doA,
  12.  b: doB,
  13.  ...
  14. }
  15. CONDITIONS[condition]()

单一职责

  1. //bad
  2. function xxx() {
  3.   val1 = ...
  4.   val2 = ...
  5.     if (conditionA) {
  6.       ...
  7.       val1 = ...
  8.   } else if (conditionB) {
  9.     val2 = ....
  10.   }
  11.   for (let i=0; i<val1; i++) {
  12.     doSomeThing(val2[i])
  13.   }
  14. }
  16. //good
  17. function getVal1 () {
  18.   ...
  19.  return val1
  20. }
  22. function getVal2 () {
  23.   ...
  24.  return val2
  25. } 
  27. function iterate (val1, val2) {
  28.  for (let i=0; i<val1; i++) {
  29.     doSomeThing(val2[i])
  30.   }
  31. }
  33. function xxx() {
  34.  iterate(getVal1(),getVal2());
  35. }

使用 break 和 return 代替控制标记

  1. //bad
  2. function xxx () {
  3.  let flag = false;
  4.  for (let i=0; i<val1; i++) {
  5.    if (!flag) {
  6.      if (i === ....) {
  7.        flag = true
  8.        doSomeThing(val2[i])
  9.      }
  10.    }
  11.   }
  12. }
  14. //good
  15. function xxx () {
  16.  let flag = false;
  17.  for (let i=0; i<val1; i++) {
  18.      if (i === ....) {
  19.        doSomeThing(val2[i])
  20.        break;
  21.      }
  22.   }
  23. }

函数取代参数

  1. //bad
  2. function setVal(name, val) {
  3.   if (name === 'a') {
  4.    a = val
  5.   } else if (name === 'b') {
  6.    b = val
  7.   }
  8. }
  10. //good
  11. function setA (val) {
  12.  a = val
  13. }
  14. function setB (val){
  15.  v =val 
  16. }

逆向条件

  1. //bad
  2. function xxx() {
  3.   if (condition === 'a' || condition === 'b' || condition === 'c') {}
  4. }
  6. //good
  7. function xxx() {
  8.   if (condition !== 'd') {}
  9. }

合并条件

  1. //bad
  2. function xx () {
  3.  if (num === 0) {
  4.   return 0
  5.  } else if (num === 1) {
  6.   return 1
  7.  } else if (num === 2) {
  8.   return 4
  9.  } else if (num === 3) {
  10.   return 6
  11.  }
  12. }
  14. //good
  15. function xx() {
  16.  if ([0,1].includes(num)) {
  17.   return num
  18.  } else if ([2,3].includes(num)) {
  19.   return num * 2
  20.  }
  21. }

条件语义化

  1. //bad
  2. function xx() {
  3.  if ( (a > 1 && b >2) || (c>3 && d>4) || (!val1 && !val2)) {
  4.   ...
  5.  }
  6. }
  8. //good
  9. function isXXX1() {
  10.  return a > 1 && b >2
  11. }
  12. function isXXX2() {
  13.  return c>3 && d>4
  14. }
  15. function isNotXXX3() {
  16.  return !val1 && !val2
  17. }
  18. function xx () {
  19.  if (isXXX1 || isXXX2 || isNotXXX3()) { ...}
  20. }

禁止多层条件判断嵌套

  1. //bad
  2. if (conditionA) {
  3.   if (conditionA1) {
  4.     if (...){}
  5.   } else if (conditionA2) {
  6.    if (...) {}
  7.   }
  9. } else if (conditionB) {
  10.  if (conditionB1) {
  11.     if (...){}
  12.   } else if (conditionB2) {
  13.    if (...) {}
  14.   }
  15. } else {
  16.  if (conditionC1) {
  17.     if (...){}
  18.   } else if (conditionC2) {
  19.    if (...) {}
  20.   }
  21. }
  23. // good
  24. if (conditionA) {
  25.   conditionA()
  26. } else if (conditionB) {
  27.  conditionB()
  28. } else {
  29.  conditionC()
  30. }