初學者指南:深入了解 JavaScript 的 continue 與 break 語句

更新日期: 2024 年 10 月 16 日

在學習 JavaScript 的過程中,控制流程是非常重要的一部分。

continuebreak 是兩個常用的控制語句,能夠改變循環(如 forwhile)的執行流程。

本文將為新手詳細介紹這兩個語句的用法和差異,並通過示例幫助你更好地理解它們。


break 語句

功能說明

break 語句用於立即終止最內層的循環或 switch 語句,程式將跳出該結構並繼續執行後續代碼。

使用範例

範例 1:在循環中使用 break

for (let i = 1; i <= 10; i++) {
    if (i === 5) {
        break;
    }
    console.log(i);
}

輸出:

1
2
3
4

解釋:

i 等於 5 時,break 語句被觸發,循環立即終止,因此只輸出了 1 到 4。

範例 2:在 switch 語句中使用 break

let day = 3;

switch (day) {
    case 1:
        console.log('星期一');
        break;
    case 2:
        console.log('星期二');
        break;
    case 3:
        console.log('星期三');
        break;
    default:
        console.log('未知的日期');
}

輸出:

星期三

解釋:

break 語句在每個 case 後,用於防止執行落入下一個 case


continue 語句

功能說明

continue 語句用於跳過本次迭代的剩餘代碼,直接開始下一次迭代。

循環不會終止,只是跳過當前的一次執行。

使用範例

範例 1:在循環中使用 continue

for (let i = 1; i <= 5; i++) {
    if (i === 3) {
        continue;
    }
    console.log(i);
}

輸出:

1
2
4
5

解釋:

i 等於 3 時,continue 語句被觸發,跳過當前迭代,所以沒有輸出 3。


breakcontinue 的區別

  • 作用範圍:
    • break:終止整個循環或 switch 語句。
    • continue:僅跳過當前迭代,循環會繼續進行。
  • 使用情境:
    • 使用 break 當需要在某個條件滿足時,立即退出循環。
    • 使用 continue 當需要在某個條件滿足時,跳過本次迭代的後續代碼。

實際應用示例

範例:篩選數組中的奇數

let numbers = [1, 2, 3, 4, 5, 6];

for (let num of numbers) {
    if (num % 2 === 0) {
        continue; // 偶數,跳過
    }
    console.log(num); // 只輸出奇數
}

輸出:

1
3
5

範例:尋找數組中的特定值

let fruits = ['蘋果', '香蕉', '櫻桃', '橙子'];

for (let fruit of fruits) {
    if (fruit === '櫻桃') {
        console.log('找到櫻桃,停止搜尋。');
        break;
    }
    console.log('正在檢查:' + fruit);
}

輸出:

正在檢查:蘋果
正在檢查:香蕉
找到櫻桃,停止搜尋。

注意事項

  • 嵌套循環中的使用: breakcontinue 只會影響到它們所在的最內層循環。要退出多層循環,可以使用標籤(label)語句,但不推薦,因為會降低代碼可讀性。
  • 避免過度使用: 雖然 breakcontinue 很方便,但過度使用可能使代碼難以理解。建議在確有必要時才使用,並保持代碼的清晰度。

總結

breakcontinue 是 JavaScript 中強大的控制流程工具。

break 用於終止循環或 switch 語句,而 continue 用於跳過當前迭代並進入下一次循環。

理解它們的用法有助於你更有效地控制程式的執行流程。

希望這篇文章能幫助你更好地理解 breakcontinue,在實際開發中靈活運用它們,提升程式的效率和可讀性。


參考資料

Similar Posts