java amp 8230,详解JavaScript 中 if / if…else…替换方式 - 易采站长站

说说烂大街的if/if…else…，程序中用得最多的流程判断语句。

对着曾经满屏的if/if…else…，心想能不能搞点事情，折腾点浪花浪里呀浪。

对顶着“这个需求很简单，怎么实现我不管，明天上线”的程序猿，答案必须YES。

“Write Less, Do More”，学习进步的本质就是为了更有效率地偷懒。

废话说完，直接上方法汇总，让我们来一窥究竟：

switch改写if

// if 版本

var a = 1;

if(a > 1 && a < 5) {

return 1

} else if(a > 5 && a < 10){

return 5

}else{

return 10

}

// switch 改版

switch(true){

case (a > 1 && a < 5):

return 1

case (a > 5 && a < 10):

return 5

default:

return 10

}

以上代码的switch…case…的用法实际使用不多，仅供参考。

一般case为常量时switch…case…用得较多。

选择分支较多时，建议选用switch…case可提高程序的效率，但switch…case不足的地方在于只能处理字符或者数字类型的变量，if…else更加灵活，可用于判断表达式是否成立，比如if(a+b>c),if…else的应用范围更广。

三元运算符改写if

// if 版本

if (bool) {

value = 1;

} else {

value = 2;

}

// 三元运算符 版本

value = bool ? 1 : 2;

// 三元预算符 多个运算需要括号包裹 此处用了逗号表达式

return typeof foo === 'object'?(console.log(1),1):(console.log(2),2);

优点：代码简化，更加清爽，write less

缺点：复杂的三元运算符可读性较差，需友好注释

TIPS: 三元运算符后面不能带return

// 错误用法，运算符号后不能带return

bool ? return 1 : return 2;

逻辑判断 and(&&)和or(||) 改写if

原理：利用逻辑判断的短路运算来实现

短路：&& 中第一个表达式为假就不会去处理第二个表达式，|| 则相反

// if为真

if (bool) {

value = getYes();

}

// &&改版

bool && (value = getYes());

// if为假

if (!bool) {

value = getNo();

}

bool || (value = getNo());

优点：代码简化，更加清爽，write less

缺点：适用于简单判断逻辑，复杂的判断运算可读性较差，需友好注释

TIPS：适用于没有else的场景, 逻辑运算符后面不能带return

// 错误用法，运算符号后不能带return

boll || return true;