JavaScript，作為一種廣泛使用的程式語言，它的流程控制語句是構建邏輯和實現功能的基礎。流程控制語句包括條件語句、迴圈語句和轉向語句，它們是程式設計中不可或缺的部分。
接下來，我們將一一解析這些語句，帶你走進JavaScript的世界。
一、什麼是流程控制語句
流程控制語句是用來控制程式中語句執行順序的語句，它們可以影響程式的流程，從而實現不同的邏輯。流程控制語句主要分為以下三類：
順序結構： 這是最基本的流程控制，代表程式碼按照書寫的順序從上到下依次執行。通常程式都是從第一行程式碼開始順序執行到結束的。
選擇結構： 用於根據特定條件來控制程式碼的執行路徑。常見的選擇結構包括if、else、if-else if和switch等。這些語句允許程式在滿足某些條件時執行特定的程式碼塊，而在其他條件下執行另外的程式碼塊或跳過某些程式碼。
迴圈結構： 用於重複執行某段程式碼直到滿足退出條件為止。迴圈語句包括for、foreach、while和do-while等。透過這些語句，可以實現固定次數的迴圈或者當某個條件成立時的持續迴圈。
此外，還有跳轉語句如break、continue和return等，它們可以改變正常的控制流程，例如跳出當前迴圈或者返回函式的結果。
二、條件判斷語句
使用條件判斷語句可以在執行某個語句之前進行判斷，如果條件成立才會執行語句,條件不成立，則語句不執行。
語法一：if(條件表示式){語句…};
執行流程：
if語句在執行時，會先對條件表示式進行求值判斷，
- 如果條件表示式的值為true，則執行if後的語句，
- 如果條件表示式的值為false，則不會執行if後的語句if語句只能控制緊隨其後的那個語句。
如果希望if語句可以控制多條語句，可以將這些語句統一放在程式碼塊中，如果就一條if語句，程式碼塊不是必須的，但在開發中儘量寫清楚。
程式碼演示：
<script>
if(true) console.log('好好學習，天天向上');
// 加上條件運算子 && ||
var a=20;
if(a>10&&a<=20){
alert('a在10-20之間');
alert("4567")
}
</script>
語法二：if…else…語句
語法：
if（條件表示式）{
語句....
}else{
語句....
}
執行流程：
當該語句執行時，會先對if後的條件進行判斷，
-
如果該值為true，則執行if後的語句，
-
如果該值為false，則執行else後的語句，兩者選其一執行。
語法三：if…else if…else
語法：
if(條件表示式){
語句....
}else if(條件表示式){
語句....
}else{
語句....
}
執行流程：
當該語句執行時，會從上到下依次對條件表示式進行求值，
-
如果值為true，則執行當前語句。
-
如果值為false，則繼續向下判斷，如果所有的條件都不滿意，就執行最後一個else或者不執行，該語句中，只會有一個程式碼塊被執行，一旦程式碼塊執行了， 則直接結束語句。
<script>
var age=16;
/* if(age>=60){
alert("你已經退休了～～～")
}else{
alert("你還沒退休～～～")
} */
if(age>=100){
alert("您老高壽呀～～～");
}else if(age>=80){
alert("你也不小了");
} else if(age>=60){
alert("你剛退休呀～～～");
}else if(age>=30){
alert("你已經中年了");
}else if(age>=17){
alert("你剛成年呀～～～");
}else{
alert("你還是個小孩子～～")
};
</script>
三、條件分支語句
switch語句是一種多分支選擇結構，它可以根據表示式的值，來選擇執行不同的程式碼塊。
語法：switch…case…
switch(條件表示式){
case 表示式:
語句....
break;
case 表示式:
語句....
break;
default:
語句...
break;
}
執行流程：
在執行時，會依次將case後的表示式的值和switch後的條件表示式的值進行全等比較。
-
如果比較結果為true，則從當前case處開始執行程式碼，當前case後的所有程式碼都會執行；
-
在case的後邊跟著一個break關鍵字，這樣可以確保只會執行當前case後的語句，而不會執行其他的case；
-
如果比較結果為false，則繼續向下比較；
-
如果所有的比較結果都為false，則只執行default後的語句；
注意： switch語句和if語句的功能實際上有重複的，使用switch可以實現if的功能，同樣使用if也可以實現switch的功能，所以我們使用時，可以根據自己的習慣選擇。
想要快速入門前端開發嗎？推薦一個免費前端開發基礎課程，這個老師講的特別好，零基礎學習無壓力，知識點結合程式碼，邊學邊練，可以免費試看試學，還有各種輔助工具和資料，非常適合新手！點這裡前往學習哦！
程式碼演示：
<script>
var num=2;
switch(num){
case 1:
console.log("壹");
//使用break可以退出switch語句
break;
case 2:
console.log("貳");
break;
case 3:
console.log("叄")
break;
default:
console.log("非法數字～～～");
break;
}
</script>
四、迴圈語句
迴圈語句，就是讓某段程式碼反覆執行。在JavaScript中，主要有for迴圈、while迴圈、do…while迴圈等。
1） while迴圈
語法：
while(條件表示式){
語句
}
while語句執行流程：
先對條件表示式進行求值判斷，如果值為true，則執行迴圈體，迴圈體執行完畢以後，繼續對錶達式進行判斷,如果值為false，則終止迴圈。
2） do…while迴圈
語法：
do{
語句....
}while(條件表示式)
執行流程：
do…while 語句在執行時，會先執行迴圈體，迴圈體執行完畢後，再對while後的條件表示式進行判斷，如果結果為true，則繼續執行，執行完畢繼續判斷,如果結果為false，則停止執行。
注意： 實際上以上兩個語句功能類似，不同的是while 是先判斷後執行，而do…while會先執行後判斷，do…while可以保證迴圈體至少執行一次，而while不行。
3）for語句（for迴圈）
在for迴圈中，為我們提供了專門的位置，用來放三個表示式。
- 初始化表示式
- 條件表示式
- 更新表示式
for迴圈的語法：
for(初始化表示式;條件表示式;更新表示式){
語句....
}
for迴圈的執行流程：
-
初始化表示式，初始化變數（初始化表示式，只會執行一次）；
-
條件表示式，判斷是否執行迴圈；
-
如果為true，則執行迴圈，如果為false，終止迴圈；
-
執行更新表示式，更新表示式執行完畢繼續重複。
<script>
//第一種寫法
for(var i=0;i<10;i++){
alert(i);
}
//第二種寫法 for迴圈中的三個部分都可以省略，也都可以寫在外部
var i=0;
for(;i<10;){
alert(i++);
}
//如果在for迴圈中，不寫任何的表示式，只寫兩個;
//此時迴圈是一個死迴圈，會一直執行下去，慎用
for(;;){
alert("hello");
}
</script>
五、break和continue語句
break關鍵字
可以用來退出switch或迴圈語句，不能在if語句中使用break和continue，break關鍵字，會立即終止離它最近的那個迴圈語句。
continue關鍵字
可以用來跳過當次迴圈，同樣continue也是預設只會對離它最近的迴圈起作用。
終止指定迴圈
可以為迴圈語句建立一個label（標籤），來標識當前的迴圈。
語法：
label(給起的標籤名字):迴圈語句
使用break語句時，可以在break後跟著一個label，這樣break可以結束指定的迴圈，而不是最近的。
程式碼演示
<script>
/* for(var i=0;i<5;i++){
console.log(i);
//break;//用來結束for的迴圈語句，for只會迴圈一次
if(i==2){
break;//這個break是對整個for迴圈起作用的
}
} */
/* for (var i = 0; i < 5; i++) {
console.log("@外層迴圈" + i);
for (var j = 0; j < 5; j++) {
break;//只會結束離他最近的內層迴圈
console.log("內層迴圈" + j);
}
} */
/* outer: for (var i = 0; i < 5; i++) {
console.log("@外層迴圈" + i);
for (var j = 0; j < 5; j++) {
break outer; //指定結束外層的for迴圈
console.log("內層迴圈" + j);
}
} */
for (var i = 0; i < 5; i++) {
if (i == 2) {
continue;
}
console.log(i);
}
</script>
JavaScript的流程控制語句，就像是一把魔法棒，它能讓我們的程式碼按照我們的意願去執行。掌握了這些語句，我們就可以在程式設計的世界裡自由翱翔。
希望這篇文章能幫助你更好地理解和使用JavaScript的流程控制語句，讓我們一起在程式設計的道路上，探索更多的可能性。