JS条件语句优化

版权声明：本文为博主（风轻云淡）原创文章，未经博主允许不得转载。CSDN https://blog.csdn.net/qq_20343517/article/details/82945080

JS条件语句优化妙招

JavaScript条件语句在我们平时的开发中是不可避免要用到的，但是很多时候我们的代码写的并不好，下面我们就看看几个可以优化的地方(我们优化的目标是嵌套层级更少，代码更简洁和易读)

是否包含

我们经常会判断某个变量等于某些值，于是会写出这样的代码

function sayHi(name){
    if(name=='tom'||name=='hxh'||name=='lmly'){
        return 'hello'
    }
}

如果还要再加值就会显得越来越臃肿了，事实上就是判断该变量是否在某个值的范围中

function sayHi(name){
    let names=['tom','hxh','lmly'];
    if(names.indexOf(name)>-1){
        return 'hello'
    }
}

看上去是不是合理多了？我们提出了公共的逻辑，以后只需要维护names这个数组即可，当然也可以用includes()

if(names.includes(name)){
   return 'hello'
}

尽早返回

先看代码

function sayHi(name){
    if(name){
        if(name=='hxh'){
            return 'hello';
        }
    }else{
        return 'no';
    }
}

这里我们先判断了 name 是否存在，于是出现了嵌套if，但是如果我们一开始就将不存在name的情况直接返回

function sayHi(name){
    if(!name){
        return 'no';
    }
    if(name=='hxh'){
        return 'hello';
    }
}

我们会发现代码少了嵌套层级，可读性提高了。

键值对象

switch...case 想必大家也是经常会用到的句式

function sayHi(name){
    let str="";
    switch(name){
        case 'tom':{ str='hello1'; } break;
        case 'hxh':{ str='hello2'; } break;
        case 'lucy':{ str='hello3'; } break;
        default :{str='no'; }
    }
    return str;
}

其实稍微细看一下就会发现，这和对象键值对很像，于是我们改成下面的方式

function sayHi(name){
    return {
        'tom':'hello1',
        'hxh':'hello2',
        'lucy':'hello3',
    }[name]
}

代码是不是简洁多了？

参数默认值

方法参数为空是我们经常需要处理的，多数情况下是的给一个默认值

function sayHi(name){
    if(!name){
        name='tom'
    }
}

这个时候我们可以使用||来简化代码

function sayHi(name){
    name=name||'tom';
}

如果你的代码运行环境支持ES6,那就可以直接使用参数默认值语法

function sayHi(name='tom'){
    return name;
}