JavaScript | 基礎構文：ループ – break

break を一言でいうと

break は、
「今やっているループ（繰り返し）を、その場で強制終了する」
ためのキーワードです。

for や while の途中で
「もうこれ以上回さなくていい」と判断した瞬間に、
残りの周回を全部スキップして、ループの外へ一気に抜けます。

continue が「この一周だけスキップして次の周へ」なのに対して、
break は「このループ自体をここで終わりにする」です。

まずは基本：for 文での break の動き

0〜9 を回しつつ「5 になったらループ終了」

一番シンプルな例から見てみましょう。

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    console.log("ループを終了します");
    break;
  }
  console.log(i);
}

for (let i = 0; i < 10; i++) {
  if (i === 5) {
    console.log("ループを終了します");
    break;
  }
  console.log(i);
}

出力はこうなります。

0
1
2
3
4
ループを終了します

5 以降の数字は出てきません。

流れを言葉で追うとこうです。

• i = 0 → if に入らない → console.log(0)
• i = 1 → if に入らない → console.log(1)
• i = 2 → if に入らない → console.log(2)
• i = 3 → if に入らない → console.log(3)
• i = 4 → if に入らない → console.log(4)
• i = 5 → if に入る → 「ループを終了します」と表示 → break 実行 → ループ全体から抜ける

ここで一番大事なのは、
break が実行された瞬間、「残りの周回」は一切行われない
ということです。

continue のように「次の周へ」ではなく、
「この for 文そのものが終わる」とイメージしてください。

while ループでの break

条件に関係なく「ここで終わり」にできる

while でも break の意味は同じです。
「ループをここで終わらせる」です。

let i = 0;

while (i < 10) {
  if (i === 5) {
    console.log("while ループを終了します");
    break;
  }
  console.log(i);
  i++;
}

let i = 0;

while (i < 10) {
  if (i === 5) {
    console.log("while ループを終了します");
    break;
  }
  console.log(i);
  i++;
}

出力はこうなります。

0
1
2
3
4
while ループを終了します

ポイントは、
while (i < 10) という条件がまだ true でも、
break が実行された瞬間にループが終わることです。

ここが重要です。
break は「条件式に関係なく、今すぐループを終わらせるスイッチ」
だと捉えると分かりやすいです。

break と continue の違いをハッキリさせる

並べて見ると違いがよく分かる

同じ条件で continue と break を並べてみます。

console.log("=== continue の場合 ===");
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    continue;
  }
  console.log(i);
}

console.log("=== break の場合 ===");
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    break;
  }
  console.log(i);
}

console.log("=== continue の場合 ===");
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    continue;
  }
  console.log(i);
}

console.log("=== break の場合 ===");
for (let i = 0; i < 10; i++) {
  if (i === 3) {
    break;
  }
  console.log(i);
}

出力はこうなります。

=== continue の場合 ===
0
1
2
4
5
6
7
8
9
=== break の場合 ===
0
1
2

continue のとき
→ 「3 の回だけスキップして、4〜9 は続ける」

break のとき
→ 「3 に到達した瞬間、ループ自体を終了する」

ここが重要です。
「この条件のときだけ処理を飛ばしたい」なら continue、
「この条件になったら、もうループ自体を終わらせたい」なら break
と覚えておくと、使い分けがスッと入ります。

実用的な例1：特定の値を見つけたらループ終了

配列の中から「最初に見つかったもの」だけ探したい

例えば、配列の中から「最初に 7 を見つけたら、それ以降は調べなくていい」
という場面を考えます。

const numbers = [1, 3, 7, 9, 7, 11];

for (let i = 0; i < numbers.length; i++) {
  const n = numbers[i];

  if (n === 7) {
    console.log("7 を見つけました！インデックス:", i);
    break;
  }

  console.log("チェック中:", n);
}

const numbers = [1, 3, 7, 9, 7, 11];

for (let i = 0; i < numbers.length; i++) {
  const n = numbers[i];

  if (n === 7) {
    console.log("7 を見つけました！インデックス:", i);
    break;
  }

  console.log("チェック中:", n);
}

出力はこうなります。

チェック中: 1
チェック中: 3
7 を見つけました！インデックス: 2

2 つ目の 7（インデックス 4）は調べていません。
最初の 7 を見つけた時点で break しているからです。

ここでのポイントは、
「目的が達成されたら、無駄なループはしない」 という発想です。

配列が大きくなればなるほど、
早めに break することで無駄な処理を減らせます。

実用的な例2：無限ループからの脱出に使う

while(true) と break の組み合わせ

ユーザー入力を繰り返し受け付けるような処理では、
「いつ終わるか分からない」ループを書くことがあります。

例えば、
「0 が入力されたら終わり、それ以外なら続ける」
という処理を考えます。

while (true) {
  const input = prompt("数字を入力してください（0 で終了）");
  const num = Number(input);

  if (num === 0) {
    console.log("終了します");
    break; // 無限ループから脱出
  }

  console.log("入力された数:", num);
}

while (true) {
  const input = prompt("数字を入力してください（0 で終了）");
  const num = Number(input);

  if (num === 0) {
    console.log("終了します");
    break; // 無限ループから脱出
  }

  console.log("入力された数:", num);
}

while (true) は条件的には永遠に続きますが、
break によって「ユーザーが 0 を入力したら終了」という出口を作っています。

ここが重要です。
「いつ終わるかは中のロジック次第」というループでは、
while (true) ＋ break という形がよく使われます。
ただし、必ずどこかで break されるように設計することが大前提です。

実用的な例3：ネストしたループでの break

内側のループだけ終わらせる

二重ループでも break は使えます。
まずはラベルなしのシンプルなパターン。

for (let i = 1; i <= 3; i++) {
  console.log("外側ループ i =", i);

  for (let j = 1; j <= 3; j++) {
    if (j === 2) {
      console.log("  j が 2 なので内側ループを終了");
      break; // 内側のループだけ終了
    }
    console.log("  内側ループ j =", j);
  }
}

for (let i = 1; i <= 3; i++) {
  console.log("外側ループ i =", i);

  for (let j = 1; j <= 3; j++) {
    if (j === 2) {
      console.log("  j が 2 なので内側ループを終了");
      break; // 内側のループだけ終了
    }
    console.log("  内側ループ j =", j);
  }
}

出力はこうなります。

外側ループ i = 1
  内側ループ j = 1
  j が 2 なので内側ループを終了
外側ループ i = 2
  内側ループ j = 1
  j が 2 なので内側ループを終了
外側ループ i = 3
  内側ループ j = 1
  j が 2 なので内側ループを終了

break は「一番内側のループ」だけを終了します。
外側の for (let i...) は普通に回り続けます。

ラベル付き break（知識として）

JavaScript には「ラベル付き break」もあります。

outer: for (let i = 1; i <= 3; i++) {
  for (let j = 1; j <= 3; j++) {
    if (j === 2) {
      break outer; // 外側のループごと終了
    }
    console.log(`i=${i}, j=${j}`);
  }
}

outer: for (let i = 1; i <= 3; i++) {
  for (let j = 1; j <= 3; j++) {
    if (j === 2) {
      break outer; // 外側のループごと終了
    }
    console.log(`i=${i}, j=${j}`);
  }
}

これは少しトリッキーなので、
初心者のうちは「ラベルなし break」だけ使えれば十分です。
「こういうこともできるんだ」くらいで OK。

初心者が break を使うときに気をつけたいこと

「どのループを終わらせるのか」を意識する

break は「一番内側のループ」を終わらせます。
ネストが深くなると、
「この break はどのループを止めているのか？」が分かりにくくなりがちです。

ループが複雑になってきたら、

• ループを小さな関数に分ける
• ネストを浅くする
• 場合によってはラベル付き break を検討する

といった形で、「どこを終わらせているか」が明確になるように意識してください。

break で「例外処理の代わり」をしない

たまに、
「エラーっぽい状況になったら break しておけばいいや」
という使い方をしたくなるかもしれません。

ですが、
「エラーが起きたときにどうするか」は、本来は try / catch やエラー処理で考えるべき話 です。

break はあくまで「ループの制御」のためのもの。
エラー処理とごちゃごちゃにすると、
「なぜここでループを抜けているのか」が分かりにくくなります。

「目的が達成された」「これ以上探す意味がない」
といった“ループの終了条件”に対して使う、
という軸を持っておくと、設計がブレにくくなります。

まとめ：break をどう“気持ちよく”使うか

break は、
「このループをここで終わらせる」という強いスイッチ。

for や while の途中で、
「もうこれ以上回す意味がない」と判断した瞬間に使う。

よくある使いどころは、
配列の中から「最初に見つかったもの」だけ探したいとき
while (true) のようなループから条件付きで抜けたいとき
ネストしたループの内側だけ、ある条件で終わらせたいとき

continue との違いは、
continue は「この一周だけスキップして次へ」、
break は「ループ自体を終了」。

ここが重要です。
ループを書いていて、
「この条件になったら、もうこれ以上回さなくていいよな」と感じたら、
一度 break を思い出してみてください。

その break は、
無駄な処理を減らし、
コードの意図をはっきりさせてくれる「気持ちのいい出口」になってくれます。