# 條件判斷
# if 語句
if 語句可以判斷敘述句是否成立，而是否執行該程式碼
let year = 2021; | |
if(year == 2021){ | |
console.log("hello world"); | |
console.log("you are smart"); | |
} |
# else 語句
if 語句有時會包含一個可選的 else 塊。如果判斷條件不成立，就會執行它內部的代碼。 例如：
let year = 2021; | |
if (year == 2021) { | |
console.log( 'You guessed it right!' ); | |
} else { | |
console.log( 'How can you be so wrong?' ); // 2021 以外的任何值 | |
} |
# 多個條件 : else if
有時我們需要測試一個條件的幾個變體。我們可以通過使用 else if 子句實現。
let year = 2000; | |
if (year < 2021) { | |
console.log( 'Too early...' ); | |
} else if (year > 2021) { | |
console.log( 'Too late' ); | |
} else { | |
console.log( 'Exactly!' ); | |
} |
# switch 比對
多個比對的複合式條件判斷可以用 switch 簡化程式，無論基本型態或是複合型態，都可以用 switch 做比對。
switch 的比對採用的是 === 嚴格比對。如果符合就會進行陳述句。直到遇到 break 離開 switch 區塊。
如果都沒有符合值，就會運行 default 陳述句， default 可以被省略。
let score = 88; | |
let quotient = score / 10; | |
let level; | |
switch (quotient) { | |
case 10: | |
case 9: | |
level = 'A'; | |
break; | |
case 8: | |
level = 'B'; | |
break; | |
case 7: | |
level = 'C'; | |
break; | |
case 6: | |
level = 'D'; | |
break; | |
default: | |
level = 'E'; | |
} | |
console.log('等級為: ',level); // 等級為: E |
# 循環
# for
# Java 風格的 for 語法
ES5 以前的版本就有支援，具有重複性、初始化的迴圈語法:
for( begin ; condition ; step ){ | |
// 程式碼 | |
} |
begin 通常是用來做變數宣告或初始化變數的，只執行一次。condition 在每次迴圈體運行前執行一次，判斷是 true 或 false ， true 則會再次運行， false 則否。step 在每次迴圈體運行完後就會進行一次，如有多項可以用 , 分隔。
極度建議使用 let 或 const 宣告變數，
因為， var 沒有區域的範圍。
> .editor | |
//Entering editor mode (^D to finish, ^C to cancel) | |
for( let i = 1; i <= 5 ; i++){ | |
console.log(i); | |
} | |
1 | |
2 | |
3 | |
4 | |
5 | |
undefined |
# for...of 迭代
ES6 之後的版本新增了 for...of 的用法:
> for(let v of [1, 2, 3]){ | |
... console.log(v); | |
...} | |
1 | |
2 | |
3 | |
undefined | |
> for(let v of '你好阿'){ | |
... console.log(v); | |
...} | |
你 | |
好 | |
阿 | |
undefined |
只要物件具有 Symbol.iterator 方法，令方法傳回迭代器，就可以使用 for...of 來迭代。
# for...in 列舉
列舉物件的特性名稱，可以使用 for...in 語法，搭配 [] 運算子，就可以迭代特性值。
> let obj = {x: 10, y: 20}; | |
undefined | |
> for(let v in obj){ | |
... console.log(name, obj[name]); | |
...} | |
x 10 | |
y 20 | |
undefined |
# while 迴圈
# whlie 迴圈
while(condition){ | |
// 程式碼 | |
} |
只要 condition 的值為 true ，程式碼就會不斷進行下去。
while(true){ | |
let n = Math.floor(Math.random()*10); | |
console.log(n); | |
if(n===1){ | |
console.log('I found the ONE!!'); | |
break; | |
} | |
} |
# do...while 迴圈
do{ | |
// 程式碼 | |
}while(condition); |
跟 while 迴圈一樣，當 condition 為 true 時就會反覆執行。
差別在 do...while 會至少執行一次。
let n; | |
do{ | |
n = Math.floor(Math.random()*10); | |
console.log(n); | |
}while(n!==1); | |
console.log('I found the ONE!!'); |
記得在 do...while{} 的後面加上 ; 喔～～
# break 、 continue
# break
通常條件為假時，循環會終止。 但我們隨時都可以使用 break 指令強制退出。 例如，下面這個循環要求用戶輸入一系列數字，在輸入的內容不是數字時 “終止” 循環。
let sum = 0; | |
while (true) { | |
let value = Math.floor(Math.random()*10); | |
sum += value; | |
if (sum > 100) break; | |
} | |
alert( 'Sum: ' + sum ); |
# continue
continue 指令是 break 的 “輕量版”。
它不會停掉整個循環。而是停止當前這一次迭代，並強制啟動新一輪循環（如果條件允許的話）。
如果我們完成了當前的迭代，並且希望繼續執行下一次迭代，我們就可以使用它。
下面這個循環使用 continue 來只輸出奇數：
for (let i = 0; i < 10; i++) { | |
// 如果為真，跳過循環體的剩餘部分 | |
if (i % 2 == 0) continue; | |
console.log(i); // 1，然後 3，5，7，9 | |
} |
# 標籤配合
break 跟 continue 可以配合標籤的使用，跳出指定的位置。例如:
> .editor | |
//Entering editor mode (^D to finish, ^C to cancel) | |
back:{ | |
for(let i = 0;i<5;i++){ | |
if(i === 4) | |
console.log('break back'); | |
break back; | |
} | |
console.log('Hello'); | |
} | |
break back | |
undefined |
break 搭配標籤後， back 區塊被完全跳出，因此， Hello 沒有被報出來
continue 也有類似的使用方式，但只能用在 for 迴圈之前，以控制繼續不同層的迴圈:
> .editor | |
//Entering editor mode (^D to finish, ^C to cancel) | |
back1: | |
for(let i = 0;i < 3; i++){ | |
back2: | |
for(let j = 0;j < 5; j++){ | |
if(j === 4){ | |
console.log('continue back1'); | |
continue back1; | |
} | |
} | |
console.log('Hello'); | |
} | |
continue back1 | |
continue back1 | |
continue back1 | |
undefined |
