今回は、ループの解説をしていきます。
while文
script.jsを以下のように書き換えてください。
let x = 10;
while(x > 0) {
console.log(x);
x--;
}コンソールを確認すると、10から1まで表示されます。
while文は括弧()内がtrueである限り、波括弧{}内のコードを繰り返し実行します。
このように、処理を繰り返し行うことをループと言います。
while文の括弧()内がfalseになると、ループは終了します。
別のレッスンで解説しましたが、x–は以下の式と同じ内容になります。
x = x - 1;つまり、処理を繰り返すたびにxは1ずつ減っていきます。
xが0になった時点でx > 0はfalseになるので、コンソールに0は表示されず、ループが終了します。
while文には注意が必要で、何回繰り返してもfalseにならない処理を行なってはいけません。
以下のコードは実行しないでください。
let x = 10;
while(x > 0) {
console.log(x);
x++;
}このコードでは、xは増え続けて0より小さくなることはないので、この処理は終了しません。
このように、ループが終了しない状態を、無限ループと言います。
無限ループが発生すると、ブラウザはクラッシュしてしまいます。
while文を書くときは、無限ループが発生しないように気をつけてください。
for文
for文は、繰り返す回数が決まっている時に使用します。
script.jsを以下のように書き換えてください。
let x = 0;
for(let i = 0; i < 10; i++) {
x++;
console.log(x);
}コンソールを確認すると、1から10までが表示されます。
for文の括弧内には3つの式が入ります。
最初にlet i = 0;が実行されます。1番目の式はループの最初に1度だけ実行されます。
通常は、カウントのための初期値の代入を行います。
次に2番目の式がtrueかfalseかの判定を行います。この判定は、ループごとに行われます。
2番目の式がtrueであれば、波括弧{}内のコードが実行されます。
上記の例では、i < 10がtrueかfalseの判定が行われます。iが10より小さければ、波括弧{}内のコードが実行されます。
波括弧{}内のコードが実行された後に、3番目の式が実行されます。
上記のコードでは、i++の部分です。
つまり、iが1ずつ増えて、i < 10がfalseになるまで波括弧{}内のコードが繰り返されるということです。
このように、10回処理を繰り返したい時はfor(let i = 0; i < 10; i++)と書けば10回実行することができます。