JavaScriptのforEachでbreakできない理由と解決策｜正しい書き方と代替手段を徹底解説

By 佐川 直弘 | Naohiro Sagawa (運営者)

※記事内に広告を含みます。Amazonアソシエイトとして適格販売により収入を得ています。　

1. はじめに：なぜ “forEach と break” が議論になるのか

JavaScriptで配列を扱う場面では、途中で処理を止めたいというケースがよくあります。例えば、「特定の値が見つかったタイミングでループを終了したい」「不要な計算を回避してパフォーマンスを高めたい」など、日常的なロジックの中で自然に必要になる動きです。

しかし、JavaScriptの forEach を使おうとすると、多くの初心者が必ず直面する壁があります。
それが 「forEach の中では break が使えない」 という仕様です。

一見すると通常の for 文と同じように回しているように見えるため、
「break を書けば途中終了できるはず」
と考えてしまいますが、実際には構文エラーになったり、思った通りに動作しません。

なぜこのような挙動になるのでしょうか？

実は forEach は内部構造が通常のループと異なり、途中でループを抜けることを前提に設計されていないメソッドです。そのため、正しく理解していないと「なぜ止まらないんだろう？」「return を書いても抜けないのはなぜ？」と、混乱してしまいます。

本記事では、

• なぜ forEach で break できないのか
• 代わりにどうすれば途中終了できるのか
• 実際に使うべき場面・避けるべき場面
• 詳しいコード例
  を丁寧に解説します。

JavaScriptを学び始めたばかりの方でもスッと理解できるよう、概念・コード・注意点を組み合わせて解説していきます。

では、まずは forEach がどのような構造で動いているのか、その基本から確認していきましょう。

2. forEach の基本仕様と挙動

forEach は、配列のすべての要素に対して順番に処理を実行するためのメソッドです。
直感的で読みやすいコードが書けるため、多くの開発者に利用されています。しかし、その内部構造を知らないと「なぜ break が効かないのか？」という点で戸惑うことになります。

ここではまず、forEach がどのように動作するのか、基本仕様を整理していきましょう。

■ forEach の基本的な使い方

もっともシンプルな例は次のとおりです。

const numbers = [1, 2, 3];

numbers.forEach((value) => {
  console.log(value);
});

配列 numbers のすべての要素に対して、コールバック関数が順番に呼び出され、
結果として「1 → 2 → 3」が出力されます。

forEach は「すべての要素に処理を適用する」ことを目的に作られています。

■ forEach の挙動：戻り値とコールバックの特徴

forEach には、ほかのループ構文とは異なる重要な性質があります。

● 戻り値は undefined

const result = numbers.forEach(() => {});
console.log(result); // undefined

forEach は処理結果を返すためのメソッドではありません。
「配列全体を走査すること」だけに特化しており、戻り値は常に undefined になります。

■ なぜ break が使えないのか？

一番大きな特徴は forEach は“ループ構造”ではない という点です。

• for 文
• while 文
• for...of 文

これらは 構文（syntax）としてのループ です。
そのため break・continue が「構文レベルの制御」として機能します。

一方で…

forEach は “メソッド” です。

配列が持つメソッドであり、各要素に対して コールバック関数を順番に呼び出す仕組み になっています。

そのため、コールバック関数の中はループ本体ではなく、

「単なる関数が呼ばれているだけ」

という扱いになります。

その結果：

• break → 文法エラー
• continue → 使えない
• return → コールバック関数の終了には使えるが、ループ全体は止まらない

という挙動が生まれます。

■ forEach が採用される理由

forEach は「すべての要素に必ず処理を実行したい」ケースに向いています。

• バリデーション結果を集計したい
• 全商品に対して処理を行いたい
• ログ出力や副作用の発生が目的

など、「途中で止めたくない処理」に最適です。

逆に言えば…

途中終了する可能性のある処理には適しません。

この点を理解していないと、「break が効かない」「予期しない動きをする」といった問題につながります。

3. forEach 内で break・continue を試みたときの挙動と落とし穴

forEach を使っていると、次のような疑問が必ず出てきます。

• 「forEach の中で break を使ったら止まるのでは？」
• 「continue が効くと思っていたのに…？」
• 「return を書けば抜けられるのでは？」

しかし、実際にはどれもうまく動作しません。
ここでは、それぞれの挙動とその理由を整理し、避けるべき書き方を理解していきます。

■ break を書くとどうなるのか？

まずはよくある誤りです。

numbers.forEach((num) => {
  if (num === 3) {
    break; // ← 文法エラー
  }
});

このコードは SyntaxError（構文エラー） になります。

理由は単純で、

forEach はループ構文ではないため、break が構文的に使えない

からです。

たとえば for や while の中にいるつもりでも、
実際には「ただの関数内」で break を書いているだけなのでエラーになります。

■ continue を書いた場合

次に continue。

numbers.forEach((num) => {
  if (num === 3) {
    continue; // ← これも構文エラー
  }
});

こちらも同じ理由で構文エラーになります。

• continue はループをスキップする構文
• コールバック関数の中はループ構文ではない

よって continue も動作しません。

■ return を書けばどうなる？

ここがもっとも誤解されやすいポイントです。

numbers.forEach((num) => {
  if (num === 3) {
    return; // ← その「回」の処理だけスキップ
  }
  console.log(num);
});

このコードは エラーにはなりません。

ただし、動作はこうなります：

• コールバック関数の処理を“その場で終了”
• forEach 全体は止まらず、次の要素に移る

つまり return は continue に近い動き をします。

■ 「break の代わりとして return は使えない」という落とし穴

初心者がよく誤解するのが、

return したら forEach 全体が止まるのでは？

という期待です。しかし実際には…

return では forEach を途中終了できない

という仕様になっています。

抜けられるように見えて “抜けていない” ため、
バグを生みやすい非常に危険なパターンです。

■ 無理やり止める方法：例外を投げる

強制的に処理を完全停止したい場合に、次のような方法があります。

try {
  numbers.forEach((num) => {
    if (num === 3) {
      throw 'STOP';
    }
    console.log(num);
  });
} catch (e) {
  // ここに来る
}

確かに forEach は止まります。

しかし…

● 例外を制御フローとして使うべきではない

● チーム開発では読みにくく、レビューで必ず指摘される

● パフォーマンスや可読性が下がる

という理由から、現場では「避けるべき書き方」とされています。

■ まとめ：forEach は“途中終了”ができない前提で設計されている

ここまでのポイントを整理すると、

• break → エラーで使えない
• continue → エラーで使えない
• return → コールバックだけ終了。ループ全体は止まらない
• 例外 throw → 止まるが非推奨

つまり forEach は…

“ループを途中終了させる”ための構文ではない

という明確な前提を理解しておく必要があります。

4. forEach ではなく“途中で抜けるループ”を実現するための代替策

「forEach で break が使えない」ことを理解したところで、
次に気になるのは “ではどうすれば途中で止められるのか？” という点です。

JavaScriptには、forEach の代わりに 途中終了できる構文・メソッド が複数存在します。
ここでは、それぞれの特徴・書き方・使いどころをわかりやすく整理していきます。

■ 1. 最もシンプルで確実：for 文・for...of 文

途中で抜けるループを実現したい場合、
もっとも明快で可読性が高いのは 従来の for 文 や for…of 文 です。

● for 文の例

for (let i = 0; i < numbers.length; i++) {
  if (numbers[i] === 3) break;
  console.log(numbers[i]);
}

続行・中断の条件が直感的にわかりやすく、
JavaScript初心者でも理解しやすい方法です。

● for…of 文の例（よりモダン）

for (const num of numbers) {
  if (num === 3) break;
  console.log(num);
}

• シンプルな構文
• イテレーション処理が読みやすい
• break／continue が正常に使える

という点から、「途中終了がある可能性のあるループ」には最適な選択肢 です。

■ 2. 条件一致でループを止めたいなら：some() が便利

some() は配列の要素を順番に評価し、
条件に一致した時点で true を返して処理を終了 するメソッドです。

途中終了という意味では break に最も近い動作をします。

● some() の例

numbers.some((num) => {
  if (num === 3) {
    console.log('見つかった！');
    return true; // ← ここで処理終了
  }
  console.log(num);
  return false;
});

• 条件一致で止まる
• 一致しなければ最後まで走査
• 「何かを“探す”処理」と相性が良い

という特長があります。

■ 3. 全要素をチェックしつつ止めたいなら：every() を使う

every() は「すべての要素が true の時に true を返す」メソッドですが、
評価中に false が返された時点で処理を中断 します。

● every() の例

numbers.every((num) => {
  if (num === 3) return false; // ← ここでループ終了
  console.log(num);
  return true;
});

every は次のようなシナリオに向いています。

• 条件に反する値が見つかったら終了したい
• バリデーションcheck（NGならストップ）
• 配列の健全性チェック

■ 4. 擬似的に「抜けたように見せる」方法：フラグ変数を使う

forEach を使いたいけれど、どうしても途中スキップしたい場合に
最低限の妥協策として「フラグ変数」を使う方法があります。

● フラグ変数による制御

let stop = false;

numbers.forEach((num) => {
  if (stop) return;

  if (num === 3) {
    stop = true;
    return;
  }

  console.log(num);
});

ただしこの方法には欠点があります。

• コードがやや回りくどい
• 本当に途中終了しているわけではない
• チーム開発では読みづらく避けられることが多い

そのため 推奨度は低め です。

■ 5. 強制終了：例外 throw（非推奨）

前のセクションでも触れましたが、
例外 throw を利用した停止方法もあります。

try {
  numbers.forEach((num) => {
    if (num === 3) throw 'STOP';
    console.log(num);
  });
} catch {}

確かに止まりますが、
「制御フローに例外を使う」という設計は避けるのが一般的です。

まとめ：途中終了したいなら forEach を使わない選択が正解

ここまで紹介したように、途中でループを抜けたい処理は
forEach ではなく、for／for…of／some／every を使うのがベスト です。

特に実務では以下のように使い分けます。

• 見つかったら止めたい → some
• 条件に反したら終了したい → every
• 単純に途中終了したい → for…of
• 途中終了しない場合だけ → forEach

この基準を知っているだけで、JavaScriptコードの可読性と品質が大きく向上します。

5. コード付き具体例：ケース別に見てみる

ここでは、実際の場面を想定しながら、
「forEach を使うべき時」と「使ってはいけない時」
さらに「代替策をどう書くとわかりやすいか」を、ケース別にわかりやすく紹介します。

初心者でも理解しやすいように、シチュエーションごとにコードを並べて比較していきます。

◎ ケース1：全要素を処理したい（forEach が最適）

配列の全要素をまとめて処理したい場合には、forEach がもっとも読みやすく便利です。

const prices = [120, 300, 450];

prices.forEach((price) => {
  console.log(`商品価格: ${price}円`);
});

途中終了の必要なし → forEach でOK
という典型的なケースです。

◎ ケース2：特定の値を見つけたら処理を止めたい（for…of が最強）

「見つけた瞬間に処理を打ち切る」というロジックは、forEach では実現できません。

このようなケースでは for...of がもっとも明解で可読性も高いです。

const users = ['Tom', 'Ken', 'Lisa', 'Bob'];

for (const user of users) {
  if (user === 'Lisa') {
    console.log('Lisa を見つけました。処理を終了します。');
    break;
  }
  console.log(user);
}

• break が使える
• 読みやすい
• エラーのリスクもない

実務でもこの方法が最も多く採用されています。

◎ ケース3：条件に合う要素を探索したい（some を使う）

「特定条件に一致するものを探す」場合には some() が最適です。

const items = [5, 8, 10, 3, 7];

items.some((num) => {
  if (num > 9) {
    console.log(`10以上の値を発見: ${num}`);
    return true; // ここで処理が止まる
  }
  console.log(`チェック中: ${num}`);
  return false;
});

some のメリットは…

• 条件一致で途中終了
• 条件探索に向いている
• 処理フローが自然に書ける

という点です。

◎ ケース4：すべての要素をチェックしつつ、NGなら終了（every）

フォーム入力のバリデーションなど「全項目をチェックしたいが、NG項目があれば終了」
といったケースでは every() が役立ちます。

const formValues = ['OK', 'OK', 'NG', 'OK'];

const isValid = formValues.every((value) => {
  console.log(`チェック: ${value}`);
  return value === 'OK'; // NG で false → 終了
});

console.log(`最終判定: ${isValid ? '合格' : '不合格'}`);

NG の地点で評価が止まるため、効率的です。

◎ ケース5：forEach を使いながら擬似的に止めたい（非推奨）

「できれば forEach を使いたい」という場合、フラグ変数を使う方法もあります。

let stopped = false;

numbers.forEach((num) => {
  if (stopped) return;

  if (num === 3) {
    console.log('処理終了のフラグを立てました。');
    stopped = true;
    return;
  }

  console.log(num);
});

ただし、これは「本当に止まっている」のではなく、
あくまで 次のコールバックをスキップしているだけ です。

可読性も落ちるため、チーム開発では一般的に避けられます。

◎ ケース6：強制終了したい場合（throw を利用：実務では避けるべき）

try {
  numbers.forEach((num) => {
    if (num === 3) throw 'STOP';
    console.log(num);
  });
} catch {
  console.log('ループを強制終了しました');
}

確かに止まりますが、制御フローに例外を使うコードは
「バグ」「ミス」と誤解されることが多く、レビューで確実に指摘されます。

● ケース別まとめ表

6. いつ forEach を選び、いつ代替ループを選ぶべきか

ここまで forEach の性質と、break を使いたいケースでの代替策を詳しく紹介してきました。
しかし最終的に悩むのは、

「実務ではどれを使うべき？」

という判断基準です。

ここでは、現場のコードレビューやチーム開発の視点も交えながら、
forEach を使うべき場面・避けるべき場面をわかりやすく整理します。

■ forEach を選ぶべき場面

forEach がもっとも力を発揮するのは、“全ての要素に対して必ず処理を実行したい” シンプルなケースです。

◎ forEach が適しているシナリオ

• 全要素を順番に処理したい
• 途中で止まる可能性が一切ない
• 戻り値を必要としない
• コードの意図を「全件処理です」と明示したい

● 例：全商品の価格をログ出力したい

prices.forEach((price) => {
  console.log(`価格: ${price}`);
});

こうした処理では forEach を使うことで
「この処理は全部の要素を対象にしている」という意図を明確に示せます。

■ forEach を避けるべき場面

逆に forEach を使うべきではない場面も明確です。

◎ forEach が不向きなシナリオ

• 途中でループを中断したい可能性がある
• 値を返しながら処理をすすめたい
• 「条件に一致したら終了」などの探索ロジック
• 処理の結果として boolean を返したい
• 副作用が複雑で、明確な制御フローが必要なとき

こうしたケースでは

• for…of
• some
• every

のほうが、圧倒的に読みやすく、意図も伝わりやすくなります。

■ 配列メソッドの使い分け：実務での判断基準

次の基準を持っておくと、現場で迷うことがなくなります。

◎ 1. 「途中で止めたい？」

👉 Yes → forEach は使わない
👉 No → forEach の利用が有力

◎ 2. 「何かを探索する処理？」

👉 Yes → some を選ぶ

• 条件一致で止まる
• “何かを見つける”に特化している

◎ 3. 「全要素をチェックしつつ、NG で止める？」

👉 Yes → every

• バリデーションなどに最適

◎ 4. 「ループの途中終了 + 可読性を最重視？」

👉 Yes → for…of

• JavaScript 初心者でも理解できる
• break / continue も使える

◎ 5. 「全件処理で副作用を発生させたい？」

👉 Yes → forEach

• ログ出力、集計、DOM 操作など

■ チーム開発では「forEach を乱用しない」ことが重要

意外と多いのが、JavaScript初級者が

なんでも forEach で書こうとするクセ

を持ってしまうパターンです。

この書き方は一見スッキリして見えますが、
途中終了が必要なロジックが混ざっていると バグの温床 になります。

さらにチーム開発では、

• forEach が本当に適切なのか
• break できないことを理解しているのか
• 可読性と意図が一致しているか

がレビューで厳しくチェックされます。

■ 本当に重要なのは「意図を見せること」

JavaScript には複数のループ手段がありますが、
どの方法にも共通して大切なのは

“コードを読んだときに意図がすぐ分かるか”

というポイントです。

• 全件処理なら forEach
• 条件探索なら some
• NG 判定なら every
• 柔軟に制御したいなら for…of

というように使い分けることで、
コードの意図が自然と伝わるようになります。

7. よくある質問（FAQ）

JavaScript の forEach と break に関する疑問は、初心者から中級者まで非常に多く寄せられます。
ここでは、特に質問の多い内容をまとめて、明確に回答していきます。

Q1. forEach の中で break を使うことはできますか？

いいえ、できません。
forEach の内部は「ループ構文」ではなく「単なるコールバック関数」なので、
構文としての break は使用できず、構文エラーになります。

途中で止めたい場合は：

• for...of
• for 文
• some
• every

などの別の手段を使う必要があります。

Q2. forEach の中で continue は使えますか？

いいえ、continue も使えません。
continue はループ構文専用のキーワードであり、
コールバック関数内では構文エラーになります。

「その回だけスキップしたい」場合は return を使うことで
実質的に continue と同じ動きになります。

numbers.forEach((num) => {
  if (num === 0) return; // continue 的な動き
  console.log(num);
});

Q3. return を使ったら forEach 全体から抜けられますか？

抜けられません。
return はあくまで その1回のコールバック関数の終了 を意味するだけです。

ループ全体は止まらず、次の要素に進みます。

Q4. forEach を途中で止めるために throw で例外を投げても良いですか？

技術的には可能ですが、非推奨 です。

try {
  array.forEach((value) => {
    if (value === stopValue) throw 'STOP';
  });
} catch {}

ただし、これはコードの意図が非常に読みにくくなるため、
チーム開発ではほぼ確実に避けられます。

Q5. some と every はどちらを使えば良いですか？

目的で選び方が変わります：

探索系（条件一致）は some、
全件チェック系（バリデーション）は every が適しています。

Q6. forEach は使わないほうが良いのですか？

そんなことはありません。
forEach は次のようなケースで非常に便利です。

• 全ての要素を処理するのが前提
• 途中終了の必要がない
• 副作用（ログ出力・DOM操作など）が目的

逆に「途中停止の可能性がある」なら、forEach は向いていません。

Q7. 初心者が最初に学ぶべきループ方法はどれですか？

最も理解しやすく柔軟性が高いのは for…of です。

理由：

• break / continue が使える
• 直感的で読みやすい
• オブジェクト以外のイテラブルに幅広く使える

forEach は便利ですが、制限が多いため “第二ステップ” として学ぶのが適しています。

Q8. forEach と map の違いは何ですか？

目的がまったく異なります。

forEach を map の代わりに使うのは NG です。

8. まとめ

JavaScript の forEach はとても便利なメソッドですが、
「途中で処理を止めることができない」 という明確な制約を持っています。
この仕様を理解していないと、思わぬバグや処理の暴走につながりやすいため、
正しい使い分けが非常に重要です。

この記事で解説してきた内容を、改めて整理しましょう。

■ forEach で break・continue は使えない

• forEach は「ループ構文」ではなく「メソッド」
• コールバック内に break / continue を書くと構文エラー
• return を使っても「1回のコールバック終了」しかできない

■ 途中終了したいなら別の方法を選ぶ

途中で処理を止める必要がある場合、以下の方法のほうが圧倒的に正確で読みやすいです。

• for…of：もっとも柔軟で break / continue が使える
• some()：条件一致で終了したい
• every()：全件チェックしたい（NG の時点で停止）
• for 文：細かい制御が必要な場面で強力

■ ケース別に最適なメソッドを選ぶ

こうした使い分けを明確にしておくことで、
コードの可読性と品質が大きく向上します。

■ 開発現場で重要なのは「意図が伝わるコード」

JavaScriptには複数のループ手段がありますが、
最終的なポイントは 「読んだ瞬間に意図が理解できるコード」 を書くことです。

• forEach は万能ではない
• break 禁止の仕組みを理解したうえで使う
• 目的に応じて最適なループを選ぶ
• チーム開発では可読性が何より重要

これらを意識するだけで、
実務でのエラーやレビュー指摘を大幅に減らすことができます。

9. 参考リンク・補足資料

この記事で扱った「forEach と break」の問題は、JavaScript 初心者が必ずつまずくポイントであり、公式ドキュメントや技術コミュニティでもたびたび議論されています。
最後に、学習を深めるために役立つ公式情報や補足リソースをまとめました。

■ MDN公式ドキュメント：Array.prototype.forEach

JavaScript 学習者にとって最も信頼できるリファレンスです。
forEach の仕様、使い方、注意点が詳しく解説されています。

• 特徴
  • コールバックの引数
  • 戻り値がない理由
  • 例外処理の扱い
  • break が使えない理由の理解に役立つ

Array.prototype.forEach() - JavaScript | MDN

The forEach() method of Array instances executes a provided …

■ MDN公式：Array.prototype.some / every

この記事で紹介した「途中終了できるループ」の理解を深めるために必読のページです。

• some() — 条件一致で処理終了
• every() — 健全性チェックやバリデーションに最適

構造・戻り値・挙動が明確に解説されています。

Array.prototype.some() - JavaScript | MDN

The some() method of Array instances returns true if it find…

Array.prototype.every() - JavaScript | MDN

every() は Array インスタンスのメソッドは、列内のすべての要素が指定された関数で実装されたテストに合格する…

■ JavaScript 基礎ループ：for / for…of

JavaScript のループ構文全体を学ぶことで、forEach との違いがより明確になります。

• break / continue が使える構文の理解に最適
• イテラブルと for…of の関係を体系的に把握できる

for...of - JavaScript | MDN

The for...of statement executes a loop that operates on a se…

■ Stack Overflow（英語）

世界中のエンジニアが議論する質疑応答の宝庫です。
「forEach break」関連の投稿には、実務に近い実用的な説明が多くあります。

• forEach で break できない理由
• 例外 throw を使った強制終了のデメリット
• forEach を避けるべき状況についての議論

専門的な観点から学びたい人におすすめです。

Stack Overflow

Newest 'foreach' Questions

Stack Overflow | The World’s Largest Online Community for De…

■ Qiita（日本語）

日本語で読みやすい技術記事が多く、初心者にも理解しやすい解説が揃っています。
forEach・some・every の比較など、応用に役立つ記事が充実しています。

Qiita

エンジニアに関する知識を記録・共有するためのサービス - Qiita

Qiitaは、エンジニアに関する知識を記録・共有するためのサービスです。 プログラミングに関するTips、ノウハウ、メモ…

■ 補足：学習の指針

• 「forEach は途中終了できない」 は JavaScript の基本仕様
• 初心者向け教材でもしばしば省略されがち
• 実務では forEach の使い分けが品質に影響する
• some / every / for…of を併せて理解すると大幅に応用力が増す