Conditional statements

Like loops, conditional statements will also change the running flow
There are two types of conditional statements in JavaScript

• if-else

• switch

But if- The else statement and the switch statement can be replaced with each other in many cases.
For example, the following code is equivalent

if(foo){    ...}else{    ...}

switch(foo){
    case true:        ...
    default:        ...}

But when there are many conditions, use switch. It is easier to understand

if(foo === 1){    
...}else if(foo === 2){    
...}else if(foo === 3){    
...}else if(foo === 4){    
...}else{    
...}

switch(foo){
    case 1:        ...
    case 2:        ...
    case 3:        ...
    case 4:        ...
    default:        ...}

If the number of conditions is very large, the switch statement runs faster and more obviously
To be precise : When the conditions increase, the if-else performance burden increases to a greater extent
(Most language switch statements use branch table branch table index to optimize)
And in JavaScript, the switch statement does not force type conversion. ,
That is, use the congruence operator for comparison
This way there will be no loss of type conversion

It is reasonable from a performance perspective
(if-else is suitable for judging two discrete values ​​or several different value ranges, switch is suitable for judging multiple discrete values)

This is easy to understand, but it is easily overlooked by us
Another optimization point is to try to organize if-else into a series of nested if- else statement
This is similar to our mathematical dichotomy, which can reduce the scope and execution time
Like this

if(foo >= 1 && foo < 3){
    //...}else if(foo >= 3 && foo < 5){
    //...}else if(foo >= 5 && foo < 7){
    //...}else{
    //...}

if(foo >= 1 && foo < 5){    if(foo < 3){
        //...
    }else{
        //...
    }
}else{    if(foo < 7){
        //...
    }else{
        //...
    }
}

function fn(a){
    switch(a){        
    case 0:            
    return 0;        
    case 1:            
    return 1;        
    case 2:            
    return 2;        
    case 3:            
    return 3;        
    case 4:            
    return 4;        
    case 5:            
    return 5;        
    case 6:            
    return 6;        
    case 7:            
    return 7;
    }
}

function fn(a){
    var retArr = [0,1,2,3,4,5,6,7];    return retArr[a];
}

When the number of conditions increases, the lookup table will produce almost no additional performance overhead
But it is more Suitable for situations where there is a logical mapping between a single key and a single value

that is very similar to a conditional statement? :
It is equivalent to if-else
The ternary operator is more suitable for situations where the return value is concerned
What does it mean, look at the code below

var foo;;if(flag){
    foo = 1;
}else{
    foo = 2;
}

var foo = flag ? 1 : 2;

flag? 1 : 2The return valueis directly assigned to the foo variable
This situation is very suitable for using the ternary operator

Although we rarely use a large number of conditions
And the modern browser js engine is particularly powerful (such as the V8 engine []~(￣▽￣) ~*)
But it doesn’t hurt to understand...