透過程式來做判斷,讓使用者做動作時,藉由不同的判斷,給予不同的回饋。並且透過控制判斷的運行,讓程式碼靈活度變高,維護性變好。
==
(相等)、!=
(不等於)、布林var girlAge = 18;
var boyAge = 18;
girlAge == boyAge; //true
在上面的程式碼中,=
是賦予值的意思,==
是比較值是否相等,不能混為一談。
==
和 !=
在數字、布林、字串都能使用。
==
和 !=
的嚴謹模式在寫程式碼時,有時會出現下列狀況:
1 == '1'; //true
3 != "3"; //true
true == 1; //true
false == 0; //true
這是因為JavaScript做比較時,會做轉型,將字串或布林轉換為數字,再做比較。
在這種情況下,數字為內容的字串會依內容直接轉為數值。布林的true會轉換為1,因為true在JavaScript中,有開啟、1的意思,false會轉換為0,因為false在JavaScript中,有關閉、0的意義。
如果要避免這種情況,就要用===
和!==
,改==
為===
、!=
為!==
,用這種嚴謹模式,會先判斷型別,型別相同,才會繼續判斷內容是否相同,就不會造成上述形況。
1 === '1'; //false,型別不同
3 !== "3"; //false,型別不同
true === 1; //false,型別不同
false === 0; //false,型別不同
但這並不代表==
和 !=
就毫無作用,在一般情況下,==
和===
、!=
和!==
都能使用,但如果有型別要求的情況下,採用用嚴謹模式的===
和!==
,是比較好的選擇。
>
(大於)、<
(小於)、>=
(大於等於)、<=
(小於等於)這幾個比較運算子的用法,就和一般數學上的使用相同。
80 > 10; //true
80 < 10; //false
80 >= 10; //true
80 <= 10; //false
80 >= 80; //true
80 > 80; //false
和一般變數一樣,首先先用var建立變數,命名變數名稱並宣告,最後賦予一個值,不同的是,值為true或false。
var isCorrect = true;
var isCorrect = false;
&&
(AND)所有列出的條件都要符合,寫在條件和條件之間,須為半形字元。
var girl = true;
var kid = true;
girl==true && kid==true; //true
||
(OR)所有列出的條件,只要符合其中之一即可,寫在條件和條件之間,須為半形字元。
var bill = 1500;
var VIP = false;
bill>1000 || VIP==true; //true
這個字元的位置在一般常用鍵盤(QWERTY鍵盤)的最右端,Enter鍵的上方。
!
(NOT)寫法是一個半形的驚嘆號(!
),會將true變false,false變true。
2 > 3; // false
!(2>3); //true
if 是要求程式碼在條件特定的情況下,運行程式碼,否則就不動作。
if 的寫法為:
if(條件){
條件成立後運行程式碼;
}
其中,第一行(含if行)為判斷式,第二行(條件成立後運行程式碼)為陳述式。
只要條件式不成立,就不運行陳述式。
ex:
var Amy = "girl";
if(Amy == "girl") {
console.log("Hello, girl!");
}
要特別注意的是,Amy == "girl"
中要用==
,因為不是賦予值,而是比較是否相等。
因為 if 在條件不成立時不會輸出任何資料,因此當不清楚程式碼沒有運行的原因,且在Chrome的Console中沒有錯誤時,console.log()
是很好的檢查工具。
和上面的 if 不同的是,多了一段else程式碼,在 if 的要求條件不成立時,就會運行else內的程式碼。
if...else的寫法為:
if(條件){
條件成立後運行程式碼;
}else{
條件不成立時運行程式碼;
}
當 if 內的條件不成立時,一定會運行 else部分的程式碼。
ex:
var Amy = "girl";
if(Amy == "girl") {
console.log("Hello, girl!");
}else {
console.log("Hello, user!");
}
當有條件1、條件2⋯⋯,再加上以上皆非這個選項,有多達三個或三個以上的條件選項時,就要用到else if。
可以else if 不斷增加判斷式,沒有限制,只要最後接上else和以上條件皆非食運行的程式碼即可。
但要特別注意的是,else if 只要運行了其中一段陳述式的程式碼,就不會再往下運行,所以條件的順序安排非常重要。
if(條件1){
條件1成立後運行程式碼;
}else if(條件2){
條件2成立後運行程式碼;
}else{
條件都不成立時運行程式碼;
}
ex:
var pay = 0;
var rentDay = 28;
if(rentDay <= 1){ // 1天
pay = 100;
console.log("$"+pay);
}else if(rentDay > 1 && rentDay <= 14){ //2-14天
pay = 500;
console.log("$"+pay);
}else if (rentDay > 14 && rentDay <= 30){ //15-30天
pay = 800;
console.log("$"+pay);
}else { // 超過30天
pay = 1000;
console.log("$"+pay);
}
條件式多的時候,建議寫註解,方便判斷,也有利於以後的維護。
當else if 數量太多,且條件不是範圍類型,而是有明確的選項值時,建議用switch更好。
switch的寫法為:
switch(變數或true){
case 符合值1:
執行程式碼;
break;
case 符合值2:
執行程式碼;
break;
default:
執行程式碼;
break;
}
第一行(含switch行)為表達式,小括弧中通常會放變數,也可以放true,代表switch的條件判斷成立,可以執行下面的case的比對,符合case後的值,就執行該case段的程式碼。
case接著值之後,要加一個半形冒號(:
),再接符合後該運行的程式碼,不要忘記的是,每個case最後都要寫break,阻止程式碼運行結束後繼續往下執行。
default相當於 if 判斷式當中的else,通常放在所有case結束的後面,但也可以放在任何一個case前後。
ex:
var dots = 3;
switch(dots){
case 0:
console.log('Nothing.');
break;
case 1:
console.log('A dot.');
break;
case 2:
console.log('A line.');
break;
case 3:
console.log('A triagle.');
break;
case 4:
console.log('A quadrilateral.');
break;
default:
console.log('A polygon.');
break;
}
switch和else if 基本功能相同,所以任何else if 判斷式,都可以改寫成switch。像上方else if 的例子:
var pay = 0;
var rentDay = 28;
if(rentDay <= 1){ // 1天
pay = 100;
console.log("$"+pay);
}else if(rentDay > 1 && rentDay <= 14){ //2-14天
pay = 500;
console.log("$"+pay);
}else if (rentDay > 14 && rentDay <= 30){ //15-30天
pay = 800;
console.log("$"+pay);
}else { // 超過30天
pay = 1000;
console.log("$"+pay);
}
就可以改寫成:
var pay = 0;
var rentDay = 28;
switch(true){
case (rentDay <= 1):
pay = 100;
console.log("$"+pay);
break;
case (rentDay > 1 && rentDay <= 14):
pay = 500;
console.log("$"+pay);
break;
case (rentDay > 14 && rentDay <= 30):
pay = 800;
console.log("$"+pay);
break;
default:
pay = 1000;
console.log("$"+pay);
}
但switch通常還是多使用在有明確的、固定的值這種情況,像是:
var gene = "XX";
switch(gene){
case "XX":
console.log("Female");
break;
case "XY":
console.log("Male");
break;
default:
console.log("Other Situation");
break;
}
真正讓兩者有差異的,在於效能。
switch效能較else if好,因為switch只會先比對case後的值,符合才執行該case的程式碼,else if 就算不符合不執行,但仍然會由上到下掃描過該段程式碼,因此效能較差。
所以當判斷條件較多時,通常會選擇switch,但若選擇用else if 來撰寫程式碼也沒有關係。