If there are many if else in the code, it is difficult to read and maintain. A programmer who doesn't reconstruct if else into high-quality code is not a good programmer.

To be clear, not all if / else and switch / cases need to be optimized. When we find that there are "pain points" or "smell bad code", it is best to optimize again. Otherwise, you may write an extensible code that never extends. All optimizations are for better iterative projects and better services to the business, rather than optimization for optimization.

1. Enumerate or build array values to avoid a large number of if/else and switch / cases

What day of the week is today?

function returnWeekday(){
    let string = "Today is Sunday";
    let date = new Date().getDay();
    if (date === 0) {
        string += "day";
    } else if (date === 1) {
        string += "one";
    } else if (date === 2) {
        string += "two";
    } else if (date === 3) {
        string += "three";
    } else if (date === 4) {
        string += "four";
    } else if (date === 5) {
        string += "five";
    } else if (date === 6) {
        string += "six";
    }
    return string
}
console.log(returnWeekday())

The above code really has too many else if blocks, which makes it uncomfortable to look at.

When we looked at JavaScript advanced programming, we saw this sentence:

switch statement has the closest relationship with if statement, and it is also a flow control statement commonly used in other languages.

So can we consider using switch statements to optimize it?

Note: the switch statement uses congruent operators when comparing values, and there will be no type conversion.

    let string = "Today is Sunday";
    let date = new Date().getDay();
    switch (date) {
        case 0 :
            string += "day";
            break;
        case 1 :
            string += "one";
            break;
        case 2 :
            string += "two";
            break;
        case 3 :
            string += "three";
            break;
        case 4 :
            string += "four";
            break;
        case 5 :
            string += "five";
            break;
        case 6 :
            string += "six";
            break;
    }
    return string
}
console.log(returnWeekday())

The structure here does look a little clearer than the if statement. But still a little confused?

Suppose that one day, relevant organizations find that the astrology has changed. It takes eight days a week (product thinking, you can't imagine). Our returnWeekday() method needs to add one more layer of judgment.

Our hope is that the encapsulated methods should not be modified frequently. But the change of demand is beyond your control.

    let string = "Today is Sunday";
    let date = new Date().getDay();
    // Use array
    let dateArr = [ day , one , two , three , four , five , six ];
    return string + dateArr[date]
}
console.log(returnWeekday())

    let string = "Today is Sunday";
    let date = new Date().getDay();
    // Use object
    dateObj = { 
        0:  day , 
        1: "one", 
        2: "two", 
        3: "three", 
        4: "four", 
        5: "five", 
        6: "six", 
    };
    return string + dateObj[date]
}
console.log(returnWeekday())


function returnWeekday(){
    return "Today is Sunday" + "Day one two three four five six".charAt(new Date().getDay());
}
console.log(returnWeekday())

2. The following are judged directly in advance:

if(condition){
   //dost
}else{
   return ;
}

//Replace with:
if(!condition){
   return ;
}
//dost

3. Ternary operator

handleScroll: function () {
    let offsetTop = this.$refs.pride_tab_fixed.getBoundingClientRect().top;
    if( offsetTop < 0 ){
        this.titleFixed = true
    } else {
        this.titleFixed = false
    }
    // Change to three yuan
    (offsetTop < 0) ? this.titleFixed = true : this.titleFixed = false;
    // We found that the assignment in the condition block is Boolean, so it can be simpler
    this.titleFixed = offsetTop < 0;
}

4. Logic and operators

falg && someMethod();

5. Use includes to handle multiple conditions

if( [ 202 , 203 , 204 ].includes(code) ){ someMethod() }

6. Merge condition expression

double disablityAmount(){
    if(_seniority < 2)
        return 0;
    if(_monthsDisabled > 12)
        return 0;
    if(_isPartTime)
        return 0;
    //do somethig
}

Replace with:
double disablityAmount(){
    if(_seniority < 2 || _monthsDisabled > 12 || _isPartTime)
        return 0;
    //do somethig
}

There are many others to be summarized.