【JS第5回】繰り返し処理:for文とwhile文

JavaScript基礎講座 全10回(第5回)

【JS第5回】繰り返し処理:for文とwhile文

人間が苦手とする「単純な反復作業」をコンピュータに超高速で実行させましょう。回数指定のループを得意とするfor文と、条件指定のループを得意とするwhile文の基本構造を習得します。

📌 JavaScript講座ロードマップ一覧(クリックで移動)

1. 指定回数繰り返す for 文

JavaScriptで最もよく使われるループ処理が for(フォー)文 です。「10回処理を繰り返す」といったように、回数を指定して実行したい場合に非常に役立ちます。

for文は、丸括弧の中にセミコロン `;` で区切られた以下の3つの式を記述します。

for (初期化式; 条件式; 変化式) {
    /* 繰り返したい処理 */
}
  • 初期化式(カウンタの作成): ループの開始前に1度だけ実行されます。一般的に let i = 0 のようにカウンタ変数 `i` を宣言します。
  • 条件式(継続の判定): 毎ループの実行前に判定されます。この式の結果が `true` の間、ループ処理が走り続けます(例: i < 5)。
  • 変化式(カウンタの更新): ループの処理が1回終わるたびに自動実行され、カウンタ変数を増やします(例: インクリメント i++ ➔ `i`を1ずつ増やす)。

2. 条件が成立している間ループする while 文

「〇〇回繰り返す」というカウンタ管理ではなく、**「特定の条件が満たされている限り、何回になるか分からないが繰り返し続ける」**という処理には while(ワイル)文 が適しています。

while文の構造は極めてシンプルで、括弧の中に「条件式」のみを書きます。

while (条件式) {
    /* 条件式が true の間、実行され続ける処理 */
}

3. 恐怖の「無限ループ」とその回避ルール

ループ処理を記述する際、プログラマーが最も注意しなければならないのが**「無限ループ(Infinite Loop)」**です。

条件式がいつまでも `false` にならない設計をしてしまうと、ブラウザは永遠にループを実行し続け、メモリを限界まで使い果たして画面が完全にフリーズ(強制終了)します。

🚨 無限ループを防ぐ鉄則

・while文を使う場合は、波括弧 `{ }` の内部で、条件式の基準となる変数を**必ず変化させる処理**(例: 変数にデータを加算したり、条件フラグを切り替えたりする記述)を書き忘れないようにしてください。
・意図せず無限ループに入ってブラウザが固まった場合は、タブを閉じるかタスクマネージャーからブラウザプロセスを強制終了してください。

4. ループ処理を書いてみよう

以下のコードは、for文による基本的な5回の出力処理と、while文による値の減算条件処理の例です。

script.js
/* ① for文による5回のリピート */
for (let i = 0; i < 5; i++) {
    console.log(`forループ: ${i + 1}回目の処理`);
}

/* ② while文による条件処理 */
let hp = 30;
while (hp > 0) {
    console.log(`キャラクター活動中(残りHP: ${hp})`);
    hp -= 10; /* hpを10減算して条件判定へ(無限ループ防止) */
}
console.log("ゲームオーバー");
✍️ 第5回 理解度チェック(問題)

for文などのループ内でカウンタ変数の数値を1つずつ増やしたい場合に使用する、変数「i」の後ろに付与する記述(インクリメント演算子)の書き方は何でしょうか?

※この問題の解答と解説は、ページ最下部(まとめの前)に掲載しています。

5. まとめと次回予告

第5回の講義はお疲れ様でした!今回の重要ポイントを振り返りましょう。

  • `for` 文は「初期化・条件・変化」を1箇所にまとめ、指定回数ループさせるのが得意。
  • `while` 文は条件式のみを記述し、条件が成立している間ループし続ける。
  • ループ終了条件の設計ミスによる「無限ループ」は、フリーズを引き起こすため細心の注意が必要。

次回(第6回)は、コードを部品化して再利用しやすくする極めて重要な機能である「関数の基本:処理の共通化と呼び出し」を学び、引数と戻り値の仕組みを理解します。お楽しみに!

🔑 第5回 理解度チェックの解答と解説

【解説】

正解は **`i++`** (プラス記号2つ)です。 `i++` は `i = i + 1` と同じ意味を持ち、変数の値を1だけ増加させる(インクリメントする)ための便利な短縮記法です。for文の「変化式」の部分でカウンタを1周ごとに加算していくため、ほぼ例外なくこの記述方法がセットで使用されます。