美文网首页
减少if-else的使用

减少if-else的使用

作者: json_q | 来源:发表于2018-12-16 17:55 被阅读0次

    前言

    之前写了很多代码,后来看看,发现里面有很多的if-else的嵌套,代码都是平铺直叙的,即使是很简单的逻辑,用了过多嵌套的if-else的话,也会感觉一下字子看不出这段代码写的是什么逻辑,所以能减少if-else嵌套是很很有必要的。下面来看看我在网上查询资料后,所总结的如果减少if-else的方法。

    优化方法

    1:简单的判断尽量用&&和||或者三元来展示
    2:合并表达式
    3:写完重新看下逻辑,扁平化if-else嵌套,平行显示
    4:有时候不一定从正向逻辑考虑,考虑反向逻辑试试
    5:有时候switch-case看起来也比if-else好
    6:用面向对象的思想,减少多状态的if-else

    代码讲解

    简单的判断尽量用&&和||或者三元来展示

    if (a) {
    a = a;
    }else {
     a = b;
    }
    // 优化之后
    a = a || b;
    ====================
    if (a > 0) {
      b = '大于0';
    }else {
      b = '小于等于0';
    }
    // 优化之后
    b = a > 0 ? '大于0' : '小于等于0';
    

    合并表达式

    if (data.status === 200) {
      if (data.data.length !== 0) {
        result = data.data;
    }
    }
    // 优化后
    if (data.status === 200 && data.data.length !== 0) {
      result = data.data;
    }
    
    =================
    if (isNaN(a)) {
      return 0;
    }
    
    if (a < 0) {
      return 0;
    }
    // 优化后
    if (a <0 && isNaN(a)) {
        return 0;
    }
    

    写完重新看下逻辑,扁平化if-else嵌套,平行显示

     function getData() {
      let result;
      
    if (a <= 0 ) {
       result = 'a小于等于0';
    }else{
        if (a >0 && a <= 10) {
          result = 'a在0到10之间';
      }else {
          if (a % 2 === 0) {
           result = 'a是偶数' ;
          }else {
                    result = 'a不是偶数';
           }
    }
    }
    return result;
    }
    
    // 这样写的这个逻辑是平铺直叙的,我们经常写这样的代码,我们想减少这样的if-else的时候,
    // 我们就要写完好好想想我们的逻辑,结合扁平化思想,平行改写上面代码
    ================
    a <= 10    => 'a小于等于0'
    0 < a <= 10 => 'a在0到10之间'
    a >10 并且 除以2为0 => 'a是偶数'
    最后'a不是偶数'
    ================
    //按照这个逻辑我们改写以上代码
    if (a <=0) {
      return  'a小于等于0';
    }
    
    if (a > 0 && a <= 10) {
     return  = 'a在0到10之间';
    }
    if (a % 2 === 0) {
      return  'a是偶数';
    }
    return 'a不是偶数';
    以上代码重新思考了逻辑,结合扁平化思想,改成这样
    

    有时候不一定从正向逻辑考虑,考虑反向逻辑试试

    加入有以下场景,写一个计算蔬菜价格的函数如下


    image.png

    我们暂定蔬菜不能为空,价格和树龄大于0,写一个计算价格的函数

    let caculateNum = (item, total, price) => {
       let result = ‘输入有误’;
        if (item) {
         if (toatl > 0 && price > 0) {
           result = total * price
       }
    }
    return result;
    }
    

    这样写没有问题,我们想要减少if-else嵌套,可以合并条件表达式,但是我们这次想用条件取反试试

    let caculateNum = (item, total, price) => {
       let result = ‘输入有误’;
       
       if (!item) {
        return  ‘输入有误’;
    }
     if (toatl > 0 && price > 0) {
           result = total * price
       }
    
    }
    return result;
    }
    

    这样子反而多了,我们可以继续条件取反

    let caculateNum = (item, total, price) => {
       let result = ‘输入有误’;
       
       if (!item) {
        return  '输入有误';
    }
     if (toatl <= 0 || price <= 0) {
           return  '输入有误';
       }
    return  total * price;
    }
    
    // 上面依旧可以改写,合并表达式
    let caculateNum = (item, total, price) => {
       let result = '输入有误';
       
       if (!item || toatl <= 0 || price <= 0) {
        return  '输入有误';
    }
    return  total * price;
    }
    

    有时候switch-case看起来也比if-else好

    let getData = type => {
        if (type === 'success') {
        console.log('success')
    }else if (type === 'fail') {
     console.log('fail')
    }else if (yupe === 'downloding') {
        console.log('downloding')
    }
    }
    
    // 优化如下
    let getData = type => {
       switch (type) {
        case 'success':
        console.log('success')
        break;
       case 'fail':
       console.log('fail')
        break;
       case 'downloding':
        console.log('downloding')
        break;
    }
    }
    

    用面向对象的思想,减少多状态的if-else

    let getData = type => {
        if (type === 'success') {
        console.log('success')
    }else if (type === 'fail') {
     console.log('fail')
    }else if (yupe === 'downloding') {
        console.log('downloding')
    }
    }
    // 优化之后
    let obj = {
        'success': function () {
        console.log('success')
      },
      'fail': function () {
        console.log('fail')
    },
    'downloding': function () {
         console.log('downloding')
    }
    }
    let getData = type => {
       obj[type];
    }
    
    

    相关文章

      网友评论

          本文标题:减少if-else的使用

          本文链接:https://www.haomeiwen.com/subject/xnrxkqtx.html