■今回のゴール
前回は条件分岐について学びました。
JavaScript if文の使い方｜条件分岐を初心者向けにわかりやすく解説【第3講】
今日のゴールは1つです。
同じ処理を何度も自動で実行できるようになることです。
■処理を繰り返すということ
掛け算の４の段を下の様に出力することを考えてみてください。
4
8
12
16
20
24
28
32
36
例えば、
console.log(4);
console.log(8);
console.log(12);
console.log(16);
console.log(20);
console.log(24);
console.log(28);
console.log(32);
console.log(36);と書けば出力出来ます。
今は9行書けば良いですが、それでも面倒です。
これを4×100まで100行出力することを考えたら大変ですよね。
そこで利用するのが「繰り返し」と言う考え方です。
上の例では、
4 ＝ 4 × 1
8 ＝ 4 × 2
12 ＝ 4 × 3
16 ＝ 4 × 4
20 ＝ 4 × 5
24 ＝ 4 × 6
28 ＝ 4 × 7
32 ＝ 4 × 8
36 ＝ 4 × 9
となっているので、
最初にcountに１を設定して、次のかっこ[]の中を9回繰り返す。
［
console.log(4*count);
countに１加える。
]
と考えるのです。
（JavaScriptでは掛け算に*という記号を使います。）
基本的に今利用されている殆どのプログラミング言語で、この繰り返しをサポートしてくれます。
JavaScriptでも楽に繰り返しが出来る様になっています。それを次に説明します。
■ for文の基本
今上に書いた例の様にcountを1から1ずつ増やして9回繰り返すということをJavaScriptでは下記の様に書きます。
for (let count = 1; count <= 9; count++) {
console.log(4*i);
}
count++
は
count = count + 1
と同じ意味でcountに1加えた数字をcountに設定（代入）することになります。
この繰り返しを表す文をfor文と言います。for文の基本的な形を下記に示しておきます。
【for文の基本形】
for (let 変数名 = 初期値; 終了条件; 変数名++) {
処理
}ここで｛｝の中が繰り返されますが、処理には複数の文を書くことが出来ます。なお、複数の文を書く場合は必ず文の末尾には;（セミコロン）を記載してください。
なお、今の例ではcountを1から始めましたが、今後この講座では、下の様に０から始めるケースが多く出て来ます。
for (let count = 0; count < 9; count++) {
console.log(4*count);
}例えばこの例では、iが0から始まって、1、2、3、4、5、6、7、8の間の９回4*countが出力されます。
（count < 9なのでcountが9になったらこのforが終わります。）
どちらも９回繰り返すという点では同じです。
■ 偶数だけ表示
このfor文を使って偶数だけ表示することを考えてみます。
下記に二つ答えを載せてみます。どちらでも
2
4
6
8
10
と表示されます。
for (let count = 1; count <= 5; count++) {
console.log(2*count);
}
for (let count = 1; count <= 10; count++) {
if (count %2 === 0) {
console.log(i);
}
}ここで count %2はcountを2で割った余りを意味します。２で割った余りが0とは偶数と言う意味になります。
この様に何か処理を行う場合のプログラムは必ずしも一つだけしか無い訳ではありません。
と言うより一つの処理を行うプログラムはいくつも考えられます。
では実際に作成する場合にどのプログラムを選ぶのかと言うと、絶対的な決まりはありませんが、処理の効率やプログラムの読みやすさなどで選ばれます。
今回の例で言えば、上のプログラムは｛｝内を5回繰り返していますが、下のプログラムは10回繰り返しています。
ただ、上のプログラムでは2*iと言う掛け算を実施しているのに対して下のプログラムではiを出力しているだけです。
なお、下の例は、for文の繰り返し処理には文を書くことが出来るので、if文を書くことも可能だということで例示してみました。
■ while文
繰り返しの説明で書いたことは下記の様に考えることも出来ます。
最初にcountに１を設定する。
［consoleが9以下の間[]内を繰り返す。
console.log(4*count);
countに１加える。
]
と考えるのです。
図で表すとこんな感じです。
これをJavaScriptでは次の様に書くことが出来ます。
let count = 1;
while (count <= 9) {
console.log(4*i);
count++;
}こちらの繰り返しの実現する文をwhile文と言います。while文は（）内の条件式が成り立っている間｛｝で囲まれた部分を繰り返します。
ここでcount++;を書き忘れたらどうなるか考えてみてください！
■ break
次のプログラムを実行してみてください。
for (let count = 1; count <= 10; count++) {
if (count === 5) {
break;
}
console.log(count);
}どうでしたか？
5まで出力されたはずです。while文の条件は10以下の間繰り返すはずですが、5になった時（count === 5）break;に出会います。
break;でこのfor文の繰り返しを抜け出すのです。
■ continue
次のプログラムを実行してみてください。
for (let count = 1; count <= 10; count++) {
if (count === 5) {
continue;
}
console.log(count);
}どうでしたか？
こんどは1から10のうち5以外が出力されたはずです。５になった時（count === 5）今度はcontinue;に出会います。
continueに出会った段階でその回の繰り返しをスキップします。
■ 宿題
九九の2の段を表示するプログラムを作ってください。
■ まとめ
今回は繰り返し処理について学びました。for文とwhile文について
for文
10回繰り返して処理するfor文は下記の様に書けます。
for (let count = 1; count <= 10; count++) {
処理
}for (let count = 0; count < 10; count++) {
処理
}上記二つは10回処理する点では同じですが、最初の値（初期値）が異なっています。
実際に実行してみて違いを理解してください。
while文
上のfor文と同じく処理を10回繰り返すことはwhile文を使って下記の様に書くことが出来ます。
let count = 1;
while (count <= 10) {
処理
count++;
}let count = 0;
while (count < 10) {
処理
count++;
}
コメント