1、使用Array.includes处理多种条件
让我们来看一下的例子：
// conditionfunction test(fruit) {if(fruit =='apple'|| fruit =='strawberry') {console.log('red');}}
一眼看去，以上的例子貌似没有什么问题。但是，如果我们加入更多的红色水果，比如车厘子（cherry）和蔓越橘（cranberries）？那就要使用||写更多的条件判断了。
为了解决以上问题，我们可以使用Array.includes来重写以上的条件判断。看以下例子：
functiontest(fruit){// extract conditions to arrayconstredFruits = ['apple','strawberry','cherry','cranberries'];if(redFruits.includes(fruit)) {console.log('red');}}
将这些“红色水果”（条件）提取到数组里面，这样写就会看起来很简洁了。
2、减少嵌套，尽早return
下面我们增加两个条件判断来扩展下上一个例子：
如果没有水果则抛出异常
如果数量超出10则输出水果数量
functiontest(fruit, quantity){constredFruits = ['apple','strawberry','cherry','cranberries'];// condition 1: fruit must has valueif(fruit) {// condition 2: must be redif(redFruits.includes(fruit)) {console.log('red');// condition 3: must be big quantityif(quantity >10) {console.log('big quantity'); } } }else{thrownewError('No fruit!'); }}// test resultstest(null);// error: No fruitstest('apple');// print: redtest('apple',20);// print: red, big quantity
看着以上的代码，发现以下的问题：
一个过滤无效条件的if/else语句
嵌套三级 if条件语句
我个人遵循的一般规则：在处理无效条件时尽早return
/_returnearly when invalid conditions found _/functiontest(fruit, quantity){constredFruits = ['apple','strawberry','cherry','cranberries'];// condition 1: throw error earlyif(!fruit)thrownewError('No fruit!');// condition 2: must be redif(redFruits.includes(fruit)) {console.log('red');// condition 3: must be big quantityif(quantity >10) {console.log('big quantity'); } }}
通过这种写法，可以减少一层嵌套。当if语句很长的时候，这种写法就比较好。（试想一下，你需要滚动到很底部才能看到else语言，这样不酷）。
我们也可以用相反的条件判断和尽早返回来减少if语句嵌套，看以下第二个条件是如何处理的。
/_returnearly when invalid conditions found _/functiontest(fruit, quantity){constredFruits = ['apple','strawberry','cherry','cranberries'];if(!fruit)thrownewError('No fruit!');// condition 1: throw error earlyif(!redFruits.includes(fruit))return;// condition 2: stop when fruit is not redconsole.log('red');// condition 3: must be big quantityif(quantity >10) {console.log('big quantity'); }}
通过在第二个条件里取反的条件来判断，现在的代码释放了一个嵌套。当我们要写很长的逻辑以及想停止更一步的过程时，这种方法很凑效。
但是，这样写并不是硬性的，要看具体的场景。有时候，你要问下自己，这样的写法（没有嵌套）是否比之前那种（在条件2嵌套）更好或者更具可读性。
对我来说，我只会远离之前的那种写法（在条件2嵌套），注意有以下两个原因：
对比嵌套if语句，这种写法更短，更简洁
取反的条件判断可能招致更多的思考过程（增加认知负荷）
因此，始终旨在减少嵌套和及时及早返回（return），但是不要过度去这样做。如果感兴趣可以查看以下的一篇相关文章和在StackOverflow的关于这主题的更多讨论：
避免else，尽早return
StackOverflow关于if/else代码风格的讨论
3、使用函数默认参数和解构
我猜以下的代码你看起来应该很熟悉了，我们仍然需要在执行JavaScript时检查空值（undefined或null）。
functiontest(fruit, quantity){if(!fruit)return;constq = quantity ||1;// if quantity not provided, default to oneconsole.log(`We have${q}${fruit}!`);}//test resultstest('banana');// We have 1 banana!test('apple',2);// We have 2 apple!
事实上，我们可以消除变量p来分配函数默认参数。看以下例子：
functiontest(fruit, quantity =1){// if quantity not provided, default to oneif(!fruit)return;console.log(`We have${quantity}${fruit}!`);}//test resultstest('banana');// We have 1 banana!test('apple',2);// We have 2 apple!
是不是看起来很简单，很直观？请记住，每个参数都有自己的默认函数参数。例如，我们也可以为fruit分配默认值（即以上代码的第一个参数）:
functiontest(fruit ='unknown', quantity = 1)
另外一个问题来了：如果fruit参数是Object类型怎么办？我们可以指定默认值吗？
functiontest(fruit){// printing fruit name if value providedif(fruit && fruit.name) {console.log (fruit.name); }else{console.log('unknown'); }}//test resultstest(undefined);// unknowntest({ });// unknowntest({name:'apple',color:'red'});// apple
看看上面的例子，我们想要打印出fruit的名称如果值存在的话，否则打印出“unknow”。我们可以通过检查默认函数参数和对象解构来避免fruit&&fruit.name这个条件。看看以下例子：
// destructing - get name property only// assign default empty object {}functiontest({name} = {}){console.log (name ||'unknown');}//test resultstest(undefined);// unknowntest({ });// unknowntest({name:'apple',color:'red'});// apple
由于我们只需要fruit对象的name属性，可以使用{name}来解构对象，然后我们可以在代码中使用name作为变量代替fruit.name。
我们还将分配空对象{}作为默认参数。如果不这样做的话，在执行test(undefined)这行代码时就会报错：无法解析’undefined’或’null’的属性name，因为undefined没有name这个属性。
如果你不介意使用第三方库，有几个方法可以减少空值检查。
使用Lodash get方法
使用Facebook 开源的idx库（和Bablejs）
以下是使用Lodash的例子：
// Include lodash library, you will get _functiontest(fruit){console.log(__.get(fruit,'name','unknown');// get property name, if not available, assign default value 'unknown'}//test resultstest(undefined);// unknowntest({ });// unknowntest({name:'apple',color:'red'});// apple
你可以在这里执行这个demo。另外，如果你热衷于使用函数式编程(FP)，你可能会选择用Lodash fp，Lodash的函数式版本（方法改为get或getOr）。Java架构交流学习圈：874811168 面向1-3年经验 Java开发人员 帮助突破瓶颈 提升思维能力
4、支持Map或对象字面量而不是switch声明
我们来看看以下例子：
functiontest(color){// use switch case to find fruits in colorswitch(color) {case'red':return['apple','strawberry'];case'yellow':return['banana','pineapple'];case'purple':return['grape','plum'];default:return[]; }}//test resultstest(null);// []test('yellow');// ['banana', 'pineapple']
以上的代码看起来貌似没什么错误，但是我发现代码十分杂乱。其实可以用字面量对象更清晰的语法来实现相同的结果。例如：
// use object literal to find fruits in colorconstfruitColor = {red: ['apple','strawberry'],yellow: ['banana','pineapple'],purple: ['grape','plum'] };functiontest(color){returnfruitColor[color] || [];}
或者，你也可以用Map来实现同样的结果，例如：
// use Map to find fruits in colorconstfruitColor =newMap() .set('red', ['apple','strawberry']) .set('yellow', ['banana','pineapple']) .set('purple', ['grape','plum']);functiontest(color){returnfruitColor.get(color) || [];}
Map是自ES6开始才可用的对象类型，可以用来存储键值对。
5、对所有或部分规则使用Array.every和Array.some
最后一个技巧是关于利用新的（其实不是很新了）JavaScript数组方法来减少代码函数。看看下面的代码，我们想所有的水果是否都是红色的。
constfruits = [ {name:'apple',color:'red'}, {name:'banana',color:'yellow'}, {name:'grape',color:'purple'} ];functiontest(){letisAllRed =true;// condition: all fruits must be redfor(letfoffruits) {if(!isAllRed)break; isAllRed = (f.color =='red'); }console.log(isAllRed);// false}
上面的代码真的好冗长！我们可以用Array.every来减少代码行数。来看看：
constfruits = [ {name:'apple',color:'red'}, {name:'banana',color:'yellow'}, {name:'grape',color:'purple'} ];functiontest(){// condition: short way, all fruits must be redconstisAllRed = fruits.every(f=>f.color =='red');console.log(isAllRed);// false}
现在是不是简洁很多了？同样类似的方法，如果你想测试是否所有的水果都是红色，可以用Array.some一行代码即可实现。
constfruits = [ {name:'apple',color:'red'}, {name:'banana',color:'yellow'}, {name:'grape',color:'purple'}];functiontest(){// condition: if any fruit is redconstisAnyRed = fruits.some(f=>f.color =='red');console.log(isAnyRed);// true}
总结
让我们一起生成更多可读代码。 我希望你能在本文中学到一些新东西。
Java架构交流学习圈：874811168 面向1-3年经验 Java开发人员 帮助突破瓶颈 提升思维能力
就这样。 写代码快乐！
(完)