JavaScript For Loop

❮ 前章へ 次章へ ❯

ループは、コードブロックを何度も実行することができます。


JavaScript ループ

毎回違う値を使用するのに、同じコードを何度も繰り返し実行したい場合にループは便利です。

多くは、配列を操作するのがこのケースです:

この様に書く代わりに:

text += cars[0] + "<br>";
text += cars[1] + "<br>";
text += cars[2] + "<br>";
text += cars[3] + "<br>";
text += cars[4] + "<br>";
text += cars[5] + "<br>";

次のように書くことができます:

for (i = 0; i < cars.length; i++) {
    text += cars[i] + "<br>";
}
Try it Yourself »

while - do / while -

さまざまな種類のループ

JavaScript では、さまざまな種類のループをサポートしています:


forループは、多くの場合、ループを作成するときに使用するツールです。 for。 ステートメント1 ステートメント ステートメント3

for ループ

for ループは、多くの場合、ループを作成するときに使用するツールです(訳注:???)。

for ループの構文は次の通りです:

for (statement 1; statement 2; statement 3) {
    code block to be executed
}

Statement 1 は、ループ(コードブロック)を開始する前に実行されます。

Statement 2 は、ループ(コードブロック)を実行するための条件を定義します。

Statement 3 は、ループ(コードブロック)が実行された後に毎回実行されます。

for (i = 0; i < 5; i++) {
    text += "The number is " + i + "<br>";
}
Try it Yourself »

上の例は、次のように読むことができます:

Statement 1 は、ループを開始する前に変数に設定します(var i = 0)。

Statement 2 は、ループの実行条件を定義します(i は 5 未満でなければなりません)。

Statement 3 は、ループ内のコードブロックが実行さた後に値(i++)を増分します。


Statement 1

通常は、ループで使用する変数の初期化に statement 1 を使用します(i = 0)。

これは、いつもそうとは限らず、JavaScript は何も管理しません。Statement 1 はオプションです。

statement 1 の中では、カンマ区切りで多数の値を初期設定できます:

for (i = 0, len = cars.length, text = ""; i < len; i++) {
    text += cars[i] + "<br>";
}
Try it Yourself »

statement 1 を省略することもできます(ループが始まる前に値が設定している場合など):

var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
    text += cars[i] + "<br>";
}
Try it Yourself »

Statement 2

statement 2 は、初期変数の状態を評価するために使用することがよくあります。

これは、いつもそうとは限らず、JavaScript は何も管理しません。Statement 2 もオプションです。

statement 2 が true を返す場合はループを再び開始し、false を返すとループは終了します。

statement 2 を省略する場合、ループの中に break を指定しなければなりません。指定しないと、ループが終わらなくなります。 これによって、ブラウザはクラッシュしてしまいす。このチュートリアルの後の章で breaks についてご覧ください。


Statement 3

statement 3 は、多くの場合、初期変数の値をインクリメントします。

これは、いつもそうとは限らず、JavaScript は何も管理しません。Statement 3 もオプションです。

Statement 3 は、負のインクリメント(i--)や、正のインクリメント(i = i + 15)など、その他のあらゆることを行うことができます。

Statement 3 も、省略することができます(ループ内で値をインクリメントする場合など):

var i = 0;
var len = cars.length;
for (; i < len; ) {
    text += cars[i] + "<br>";
    i++;
}
Try it Yourself »

For/In ループ

JavaScript for/in 文は、オブジェクトのプロパティをループします:

var person = {fname:"John", lname:"Doe", age:25};

var text = "";
var x;
for (x in person) {
    text += person[x];
}
Try it Yourself »

While ループ

while ループと do/while ループについては、次の章で説明します。


練習問題による自己診断

Exercise 1 »  Exercise 2 »  Exercise 3 »  Exercise 4 »  Exercise 5 »  Exercise 6 »


❮ 前章へ 次章へ ❯