JavaScript入門 #8 - for文とwhile文

入門 | 10分 で読める | 2026.06.14

公式ドキュメント
実演JavaScriptループ

このシリーズについて

「JavaScript入門」第8回です。今回は、同じ処理を繰り返すループを扱います。

ループとは

ループは、条件を満たす間、同じ処理を繰り返す構文です。

ループでは「いつ始まり、いつ終わるか」を必ず意識します。終了条件が間違っていると、無限ループになります。

Step 1: for文を書く

回数が決まっている繰り返しには for が向いています。

for (let i = 0; i < 5; i++) {
  console.log(i);
}

このコードは 0 から 4 までを表示します。

部分意味
let i = 0最初の値
i < 5続ける条件
i++1回ごとの更新

Step 2: 1から5まで表示する

人間に見せる番号は、1から始めることも多いです。

for (let i = 1; i <= 5; i++) {
  console.log(`${i}回目`);
}

< と <= の違いに注意します。

Step 3: while文を書く

条件が満たされる間、繰り返します。

let count = 0;

while (count < 3) {
  console.log(count);
  count++;
}

count++ を忘れると、条件がずっと true のままになり、処理が終わりません。

Step 4: breakで止める

途中でループを終わらせたい時は break を使います。

for (let i = 1; i <= 10; i++) {
  if (i === 4) {
    break;
  }

  console.log(i);
}

この例では 1、2、3 だけが表示されます。

Step 5: continueでスキップする

continue は、その回だけ処理を飛ばして次に進みます。

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

  console.log(i);
}

3 だけ表示されません。

練習

loops.js を作り、偶数だけを表示します。

for (let i = 1; i <= 10; i++) {
  if (i % 2 !== 0) {
    continue;
  }

  console.log(i);
}

よくあるエラー

困る状態よくある原因確認する場所
無限に実行される更新処理がないi++ や count++
1回多い/少ない< と <= の違い終了条件
何も出ない初期値が条件を満たしていない最初の値

注意: 無限ループになったら、ターミナルでは Ctrl + C で停止します。

次のステップ

JavaScript入門 #9 - 配列の基本 で、複数の値をまとめて扱う方法を学びます。

まとめ

for は回数が見えている繰り返し、while は条件で続ける繰り返しに向いています。ループでは、初期値、継続条件、更新処理を必ず確認します。

参考リソース

おすすめ記事

← 一覧に戻る
PR
PR
PR
PR