第 015 期 优化令人生畏的条件语句的 4 个技巧

嵌套太深，分支太多的条件语句令人生畏，难以维护。本文介绍减少嵌套深度和条件分支数量的一些技巧。

优化技巧

技巧1：尽早返回无效条件

代码语言：javascript复制

function supply(fruit, quantity) {
  const redFruits = ['apple', 'pear', 'cherry'];
  // 条件 1: 水果存在
  if (fruit) {
    // 条件 2: 属于红色水果
    if (redFruits.includes(fruit)) {
      console.log('红色水果');
      // 条件 3: 水果数量大于 10 个
      if (quantity > 10) {
        console.log('数量大于 10 个');
      }
    }
  } else {
    throw new Error('没有水果啦!');
  }
}

优化为:

代码语言：javascript复制

function supply(fruit, quantity) {
  const redFruits = ['apple', 'pear', 'cherry'];
  // 条件 1: 当 fruit 无效时，提前处理错误
  if (!fruit) throw new Error('没有水果啦');
  // 条件 2: 当不是红色水果时，提前 return
  if (!redFruits.includes(fruit)) return;
  
  console.log('红色水果');
  
  // 条件 3: 水果数量大于 10 个
  if (quantity > 10) {
    console.log('数量大于 10 个');
  }
}

技巧2：直接执行对象上的方法替代条件判断

代码语言：javascript复制

switch (action) {
  case 'add':
    return add()
  case 'update':
    return update()
  case 'list':
    return list();
  default:
    throw 'Not Support Action'
}

优化为：

代码语言：javascript复制

const handler = {
  add() {},
  update() {},
  list() {}
}

handler(action)()

技巧3：多个字符串相等判断用 includes

代码语言：javascript复制

if (
  action === 'add' ||
  action === 'update' ||
  action === 'delete'
) {
  console.log('change')
}

优化为

代码语言：javascript复制

if(['add', 'update', 'delete'].includes(action)) {
  console.log('change')
}

技巧4：对象的属性存在判断用可选链操作符

代码语言：javascript复制

if (obj && obj.a && obj.a.fn) {
  obj.a.fn()
}

优化为

代码语言：javascript复制

obj?.a?.fn?.()

参考文档

• 编写高质量可维护的代码：优化逻辑判断

技巧 优化 字符串

0 人点赞