Javascript のループ構文には大雑把に以下の種類があります。

• for
• while
• do-while
• for-in (割愛)
• for-of (割愛)
• Array 型の forEach メソッド (割愛)

長くなってしまうので下3つは別の機会に譲るとして、上3つを見ていきましょう。

for

ループ回数を指定してループを回したい場合や、特定回目のループに応じて処理を分岐したい場合に便利です。

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

    console.log(i);

    if (i === 4) {
        console.log('FINISH');
    }
}
// 0
// 1
// 2
// 3
// 4

他の多くの言語と同様に、for 文のカッコの中には

1. ループ実行前に1回だけ評価される文
2. ループごとに評価される式 (ループを継続するかどうかを返す)
3. ループごとに実行される式

を記述できます。大抵は上記例のように

1. ループインデックスとして使う変数の宣言と初期化
   • 上記例では変数 i を宣言し、0 で初期化
2. ループ継続条件を指定
   • 上記例では i が 5 未満の場合のみループが回る
3. ループインデックスをインクリメント
   • 上記例では i を 1 増やす

のように記述することが多いです。

ループインデックスを直接指定するため非常に柔軟なループを組むことが出来ますが、一方でループインデックス変数にまつわるバグを仕込む可能性もあります。

while

ループ回数が決まっていない場合や、1回もループしない可能性がある場合に便利です。

let doLoop = true;
while (doLoop) {
    const n = Math.random();
    console.log(n);

    if (n < 0.5) {
        doLoop = false;
        console.log('FINISH');
    }
}
// 0.7155129564796967
// 0.9514806089963744
// 0.49390766444656187
// FINISH

for と違い、カッコの中にはループの継続条件だけを指定します。上記例の場合、doLoop 変数が true の場合である限りループは回り続けます。doLoop の更新を忘れると無限ループに陥ってしまうので注意が必要です。

do-while

ループ回数は決まっていないが、必ず1回はループするといった場合に便利です。

let doLoop = false;
do {
    console.log('FINISH');
} while (doLoop)

while と似ていますが、こちらは必ず1回目はループが回ります。上記例の場合、doLoop 変数を false で初期化して継続条件としていますが、ループの中で doLoop の更新をしていないため、ループは1回だけで終了しています。

まとめ

Javascript の基礎的なループ構文をご紹介しました。次は for-in, for-of, Array 型の forEach メソッドを使った配列・オブジェクトのループについてです。

後編書きました。