在JS开发中,如何减少if...else...循环嵌套

在实习过程中,发现有些需求就是要进行多种不同情况的判断,但是写了太多的if...else...令代码看起来很不友好,那么应该怎么去减少那些循环嵌套呢?
代码简洁可以让后期维护成本低很多!!!

  1. 下面这种情况的代码

     if(a为真){
         a=a
     }else{
         a=b
     }
    

我们可以用下面的代码来轻松解决

    a = a || b
  1. 进阶一点的,看一下下面这种情况

     if(a==b){
         a=c
     }else{
         a=d
     }
    

我们可以用三元判断来进行简写,开发的时候真的超好用~

a=(a==b)?c:d

3.后台接口通常会返回这种数据:

task: 0 // 0=紧急,1=日常,2=临时
这个时候肯定不能用判断啊!
用啥?

var _task = ['紧急','日常','临时'];
task_type = _task[task]

最后希望大家几个建议:

  • 优化if逻辑
    把最可能出现的情况放在最前面,最不可能出现的情况放在最后面,
  • 使用Array的方法或者Map等数据结构
    比如说:

      function test(){
          if(fruit == 'apple' || fruit == 'strawberry'){
              console.log('red');
          }
      }
    

但是我们需要匹配更多的红色的水果呢?我们总不能 || 到尾吧
这个时候我们就可以使用Array.includes来重写上面的条件语句了

function test(fruit){
    const redFruit = ['apple','strawberry','cherry','cranberry'];
    if(redFruit.includes(fruit)){
        console.log('red');
    }
}

如果我们有更多水果颜色呢?

   const fruitColor1 = new Map();
   fruitColor1.set('red',['apple','strawberry']);
   fruitColor1.set('yellow',['banana','pineapple']);
   fruitColor1.set('purple',['grape','plum']);
   function test(color){
     return fruitColor1.get(color)||[];
   }
    test('yellow')// ["banana", "pineapple"]

我们就可以利用Map这个数据结构
简单来讲,Map类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。

const map = new Map([
  ['name', '张三'],
  ['title', 'Author']
]);

map.size // 2
map.has('name') // true
map.get('name') // "张三"
map.has('title') // true
map.get('title') // "Author"

在上面我们可以看到Map 也可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。

const m = new Map();
m.set('title','zty');
m.set('content','very good');
m.get('title');//zty
m.get('content');//very good

你可能感兴趣的:(在JS开发中,如何减少if...else...循环嵌套)