break 和 continue

break

break (中斷)，是用來控制迴圈或 switch 的控制語法，會中斷並跳出整個迴圈或 switch 區塊。在迴圈中 break 通常會放在 if-else 條件判斷裡面，形成「若... 就跳出整個迴圈」的邏輯。

for (let i = 1; i < 20; i++) {
    if (i % 3) {
        console.log("3 的倍數");
        break; // 輸出 1 ~ 20 第一個 3 的倍數
    }
};

continue

continue 是指跳出這次迴圈，直接進入下一次的意思，它會忽略區塊中寫在 continue 後的語句，直接執行下一次迴圈。

for (let i = 0; i < 4; i++) {
    if (i == 2) {
        continue; // 若 i 為 2 則直接進行下一次迴圈
    }
    console.log(i);
};
// 輸出結果為 0、1、3

控制指定迴圈

在雙重迴圈中，break 會跳出離自己最近的迴圈：

for (let i = 0; i < 3; i++) {
    console.log('外層迴圈')
    for (let j = 0; j < 2; j++) {
        break;
        console.log('內層迴圈')
    };
};
// 輸出結果為：外層迴圈、外層迴圈、外層迴圈

但若我們需要跳出指定迴圈，例如在內層迴圈的條件判斷中中斷整個雙重迴圈結構的話，我們需要指定要 break 的迴圈。
語法：

// 將迴圈命名
名稱:
for (let i = 0; i < 2; i++) {
}

// 指定要 break 哪個迴圈
break 名稱;

範例：

outter: // 將外層的 for 迴圈命名為 outter
for (let i = 0; i < 3; i++) {
    console.log('外層迴圈')
    for (let j = 0; j < 2; j++) {
        break outter; // break 外層迴圈 (跳出整個雙層迴圈結構)
        console.log('內層迴圈')
    };
};

// 輸出：外層迴圈

上一篇：[快速入門前端 48] JavaScript：迴圈 (3) 雙重迴圈
下一篇：[快速入門前端 50] JavaScript：Array 陣列 (1) 陣列宣告和取值
系列文章列表：[快速入門前端] 系列文章索引列表