JS的精简与优化

代码精简必然带来可读性降低.斟酌使用

有关&&和||的使用

短路原理

我们使用代码中经常会遇到

控制语句

条件调用 精简

在js逻辑运算中，0、""、null、false、undefined、NaN都会判为false

        if (i<=2) {
            ok() 
        }
        
        //精简后
        i<=2&&ok()
        !i&&ok()
        &&中第一个表达式为真处理第二个表达式

        ||中第一个表达式为假处理第二个表达式
        let o=[
          {name:11,age:12},
          {name:12,age:12},
          {name:13,age:12},
          {name:14,age:12}
        ]

        let ode=(o.length>0&&o[0].name)
        // 当操作对象不是布尔值返回下一个操作对象
        // 当第二个操作数是对象,第一个操作数求值为true是返回第二个操作数
        console.log(ode);

条件赋值的精简

    //if
    if (i == 5) {
      lv = 1;
    } else if (i == 10) {
      lv = 2;
    } else if (i == 12) {
      lv = 3;
    } else if (i == 15) {
      lv = 4;
    } else {
      lv = 0;
    }
    //switch
    switch (i) {
        case 5: lv=1
            break;
        case 10: lv=2
            break;
        case 15: lv=3
            break;
        case 20: lv=4
            break;
        default: lv=0
            break;
    }
    //最终优化
    lv={5:1,10:2,12:3,15:4}[i]||0

Array.includes的使用

Array.includes  可以做包含处理
也可以进行多重判断

if(color==='red'||color==='grend'){}

const colorCondition=['red','grend']
if(colorCondition.includes(color)){

}