六腳學院｜控制判斷( 運算子/ i f / switch )

運算子

等於         ＝＝
不等於    ！＝＝
布林          true/false

(平常的＝意思為賦予其 一個值)

var myMonth = 5;

var thisMonth = 12;

var birthdayCheck = myMonth == thisMonth;

console.log(birthdayCheck);

document.getElementById('birthdayId').textContent = birthdayCheck;

瀏覽器回覆false

var nowPeple = 1;

var totalPeople = 2;

var allPeopleNoHereCheck = totalPeople !== nowPeple;

console.log(allPeopleNoHereCheck);

document.getElementById('peopleId').textContent = allPeopleNoHereCheck;

瀏覽器回覆true

運算子嚴謹模式＝＝＝:先判斷型別(文字/數字),再判斷內容

＊true==1
    false==0

邏輯運算子

and     &&
or        ||
not      !

var myBill = 1250;

var VIP = false;

var andCheck = myBill > 1000 && VIP == true;

var orCheck = myBill > 1000 || VIP == true;

document.getElementById('andId').textContent = andCheck;

document.getElementById('orId').textContent = orCheck;

瀏覽器回覆 false ,  true





控制判斷( if / else if / switch )

if範例:

if ( hungry == ' 飢餓 ' ){             判斷式
eat( );                                           陳述式
}

var hungry = '飽足';

if(hungry == '飢餓'){

console.log('我現在好餓');

}else{

console.log('我現在一點都不想吃東西');

}

瀏覽器回覆 我現在一點都不想吃東西

if / else if 範例:

var hungry=8;

//飢餓程度1~10

function eat(food){

console.log('我現在要吃'+food);

}

if(hungry<=3){

eat('披薩');

}else if(hungry<=5 && hungry>3){

eat('沙拉');

}else if(hungry==6){

eat('餅乾');

}else{

console.log('我超飽不想吃東西')

}

瀏覽器回覆 我超飽不想吃東西

switch範例:
switch(perfer){                   設立一個表達式switch且包含一個條件.
case'牛排':
eat('牛排');
break;

case'生菜沙拉':                 case:後方開始比對,如果符合就會執行相關連的程式碼.
eat('生菜沙拉');
break;

default:
eat('拉麵');
break;                                每個case:後方皆會補上break;來阻止已經完成的區塊後方繼續執行.
}

比較與 if / else if 的差異 :
-if / else if 瀏覽器在編譯時會全部看過一遍,效能相對較差.
-switch 要看case符合, 才去看裡面程式碼,在效能上相對佳.

控制判斷練習(1)比較運算子Part1

在現實生活當中我們經常需要 判斷 目前事情的 條件 去決定現在 該做什麼事情 

像是當紅綠燈是 綠燈 時，我們就 可以走 ，相反地當紅綠燈是 紅燈 時，我們就必須 待在原地 

在上面的例子當中，綠燈跟紅燈就是條件，而可以走跟待在原地就是該做的事情

在JS中需要判斷時就可以用比較運算子來幫助我們

• ==  檢查兩者是否相等
• !== 檢查兩者是否不相等

假設現在是綠燈，所以我建立一個變數並讓它等於"綠燈"，var signalNow = "綠燈"; 

而當車子決定要不要走的時候就可以透過比較運算子來檢查現在是不是綠燈

signalNow == "綠燈" ，這件事情因為 兩者相等 成立，也就是所謂 true 

signalNow !== "綠燈" ，這件事情因為 兩者不相等  不成立，也就是所謂 false  

控制判斷練習(2)比較運算子Part2

除了 ==  和 !==  之外還有其他比較運算子

• ==  檢查兩者是否相等
• !== 檢查兩者是否不相
• A>B 檢查A是否大於B
• A<B 檢查A是否小於B
• A>=B 檢查A是否大於等於B
• A<=B 檢查A是否小於等於B

上面幾種都一定會回傳 true  表示成立或者 fasle  表示不成立

控制判斷練習(3)邏輯運算子

然而有時候我們參考的 條件  不只一個

有的時候需要 兩個條件皆符合 ，例如你想要玩線上手機遊戲你就必須要同時 擁有手機  而且 擁有網路  

有的時候只需要 其中一個條件符合 就可以，例如你想要上網，只要你 擁有手機  或者 擁有電腦  都可以

• &&  前後兩者條件皆需為 true ，也就是中文的 且 
• ||  前後兩者條間只需其中一個為 true ，也就是中文的 或 

控制判斷練習(4) if else

前面介紹了這麼多比較運算子和邏輯運算子

最終目的就是要讓我們得以順利透過判斷單個或多個條件，來決定目前要做什麼事情

if(條件){
    //條件是true就執行選項一
}else {
    //條件是false就執行選項二
}

下面再舉個例子來解釋 if else 的用法

如果(if) 現在需要喝咖啡(needCoffe) 成立就泡咖啡來喝 

不然(else) 就繼續工作 

var needCoffee = true;
if (needCoffee) {
 console.log('泡咖啡來喝');
} else {
 console.log('繼續工作');
}

現在來練習看看吧

1. 寫一個 if else
2. 判斷如果 haveDinner 是 true  就讓 hungerLevel  等於 0 
3. 不然就讓 hungerLevel  等於 10

var haveDinner = true;
var hungerLevel = 5;

//請在下方作答
if (haveDinner) {
 console.log(hungerLevel=0);
} else {
 console.log(hungerLevel=10);
}