JavaScriptで同じ処理を繰り返す、ループさせる方法/for、whileの使い方

stairs IT

Java Scriptで同じ処理を何度も繰り返したい場合に使用する、for文、while文のご紹介です。

スポンサーリンク

for文の使い方

for文は処理を行うごとに指定した変数の数を変化させ、変数がある値になったら処理を終了させる、無限ループになりにくい式です。

ループ処理(回数指定)
for(変数の指定,条件式、変数の増減処理){繰り返す処理};

なんのこっちゃという感じかもしれませんが、たとえば次のように書きます。

for (var i =0; i<3; i++){
            alert(i);
            }


この処理では、まず変数「i」に対して0を指定した上で、これが3未満であることを判定し、iを1増やして処理を1度実行、再度頭に戻ってiが3以上になるまでこの処理を繰り返しています。
for文が終わった後はその後のコードが実行されるので、直後に付け足しておけば終了後の処理を指定することも可能です。

for (var i =0; i<3; i++){
            alert(i);
            }
alert("ループ終了");

while文の使い方

ループ処理(条件式指定)
while(条件式){繰り返す処理};

見ての通りシンプルな式で、変数の指定などは別で行います。for文と同様に変数を指定して使うこともできますし、もっと複雑な式を条件にすることもできます。

var i = 0;
while (i<3){
            alert(i);
            i++;
            }
alert("ループ終了");

途中で強制終了したい場合

もし処理の途中にbreakがある場合、ループは強制終了されます(for、whileどちらにも有効)。
実際は条件分岐などして、特定の条件化ではループ処理を行わない場合などに使用します。

for (var i =0; i<3; i++){
            alert(i);
            break;
            }
alert("ループ終了");

途中でループの最初に戻したい場合

また、continueがある場合、式の途中でもループの頭に戻ります。

for (var i =0; i<3; i++){
            continue;
            alert(i);
            }
alert("数字が"+ i + "まで増えました");

forとwhile、どちらを使うべきか?

どっちでもいいです。ただ、whileのほうが「~の間は繰り返す」という構文がシンプルなので、まずはこちらに使い慣れるのをおすすめします。
for文はfor文で便利ですが、必要性を感じたら覚えるぐらいのつもりでも、特に支障はないと思います。

JavaScriptの使い方・メソッド・プロパティまとめ
HTML/CSSとセットでフロントエンドエンジニア三種の神器のひとつ、JavaScript系の記事まとめです。

コメント