当前位置 博文首页 > qg2276879379的博客:代码如何简化

    qg2276879379的博客:代码如何简化

    作者:[db:作者] 时间:2021-06-12 12:42

    前言:做为小菜鸡的我们,写出的代码往往不够简洁,在大佬review的时候,往往会把人家几颗大牙笑掉,所以啊,我们得争气,我列举下几个常见几个场景

    1.设置参数默认值:

    在这里插入图片描述
    在这里面,参数里的等号就是给参数默认值,不给实参就会采用默认的形参

    2.巧妙利用return

    在这里插入图片描述
    简化后就是const buyFruit = (amout=1)=>{return amout}

    3.如果只是单纯判断两个值然后返回布尔值时
    在这里插入图片描述
    函数体里完全可以简写成return cur==user就行了

    4.代码重复性过高的
    //简化前
    var a1 = document.getElementById("div1");
    var a2 = document.getElementById("div2");
    var a3 = document.getElementById("div3");
    var a4 = document.getElementById("div4");
    //简化方法:外部引入或提前构造以下函数:
    function id(m){
    	a = document.getElementById(m);
    	return a;
    }
    // 简化后
    var 
    a1 = id("div1"),
    a2 = id('div2'),
    a3 = id('div3'),
    a4 = id('div4')
    
    5.用其他方式代替if…else
    5.1 三元运算符

    如下代码:

    //简化前
    let message;
    if (person !== null) {
      message = `Go away, ${person}!`
    } else {
      message = 'honey there!'
    }
    //简化后
    const message = person !== null ? `Go away, ${person}!` : 'honey there!'
    
    5.2布尔运算符&&和||
    //用||简化前
    if (value) {
      test(value)
    } else {
      test(1)
    }
    //简化后
    test(value || 1)
    
    // 用&&简化前
    if (data) {
      sendData(data.value);
    }
    // 简化后
    data && sendData(data.value)