菜菜菜的前端學習日誌 - Day12

判斷式

if

說到判斷式最常使用的就是if判斷式了

而它的寫法如下

if(a > b){
    console.log('Hello');
   }                     //當a > b時就會出現Hello

if後的()內的判斷式是會判斷是否為true，如果為true才會執行{}內的程式碼。
所以如果像以下這樣

var a = true;
var b = false;
if(a){
    console.log('Hello');
   }                      //a為true，所以會出現Hello

if(!b){
    console.log('Hello');
}                         //也為true，所以會出現Hello

另外也能寫成這樣

a && console.log('Hello');

b || console.log('Hello');

if else

如果我要透過判斷去執行不同的程式碼，就可以用if else執行

var a = 3;
var b = 5;
if(a > b){
    console.log('Hello');
   }else{
    console.log('bye');
}                        //因為a沒有大於b為false，所以會出現bye

a > b ? console.log('Hello') : console.log('bye')

else if

若有很多判斷式的話就能夠用

var a = 5;
var b = 5;
if(a > b){
    console.log('Hello');
   }else if(a < b){
    console.log('bye');
}else{
    console.log('good job')
}                        //因為a不大於b也不小於b，所以直接到else執行程式

switch

如果判斷條件很多的話可以考慮使用switch

switch是先列出一個判斷的標的，接下來與case做判斷是否為true，若為true就會執行該程式碼

var a = "42";
switch(a){
        case 2: 
            alert('I am 2');
            break;
        case 42:
            alert('I am 42');
            break;
        default:
            alert('Arel(Error)');
            break;
}

以上面這段程式來說，判斷的標的是a而a = "42"，找到下面符合的case 42為true，所以會執行alert('I am 42')，跳出I am 42。

var a = "42";
switch(true){
        case a == 2: 
            alert('I am 2');
            break;
        case a == 42:
            alert('I am 42');
            break;
        default:
            alert('Arel(Error)');
            break;
}

上面這段程式又不同了，他是以true為判斷標的，所以要從case中判斷哪些為true，而a == 42符合條件。
有人可能會覺得很奇怪為什麼會相符呢？一個42是string一個是number。
因為==是寬鬆相等，它會去做強制轉型的動作，所以2邊的值是相同的，就會跳I am 42

var a = "42";
switch(true){
        case a === 2: 
            alert('I am 2');
            break;
        case a === 42:
            alert('I am 42');
            break;
        default:
            alert('Arel(Error)');
            break;
}

那這個跟上面一樣都是判斷true，不同的地方是case裡是用a === 42。
===是嚴格相等，他必須值相等型別也香等他才會為true。
都沒有相符的case，所以就會執行default的程式碼，跳出Arel(Error)。

var a = 42;
switch(a){
        case 1: 
            alert('I am 1');
        case 2:
            alert('I am 2');
        default:
            alert('Arel(Error)');
        case 3:
            alert('I am 3');
            break;
        case 4:
            alert('I am 4');
}

而最後這段程式碼會出現什麼呢？
可能有些人會很直覺的說：case都沒有一個是42的呀，會直接跳default執行程式，所以會跳Arel(Error)！！

這樣子說是沒錯，但是只對一半而已。
因為switch會以break結束，所以default後沒有break會再繼續執行下一個，所以會跳2次訊息，一個是Arel(Error)，另一個是I am 3