一口大になるまで「繰り返し」食品を切る。出来るまで「繰り返し」練習するといったように日常生活にも「繰り返し」があります。プログラミングにも繰り返し処理があり、とても大切な概念の一つです。
今回は、前回のif 文に続き、for 文に関する備忘録を投稿したいと思います。
for 文の基本構文
※ 言語によって多少異なる
for(初期化; 条件式; 変化式){
処理}
// 具体例 (1~9までを出力）
for(var i =1;i<=9;i++){
console.log(i);}
ループ処理の基本概念
「条件式が true である限り処理が続けられ、false のときループを抜ける」
この基本概念より、次のことが起こりうるので注意すること
- 無限ループに注意
- 最初から false になるような条件式を書くと上手く動かない
ループ処理のキーとなるものは？
前回投稿した if 文と同じように、ここでもキーワードになるのが条件式における**真偽値（true/false)**
2重ループ
九九のプログラミングにて
小学校の頃に覚える九九ではあるが、それをプログラミングで書くと以下のようになる
for(var i=1;i<=9;i++){
for(var j=1;j<=9;j++){
console.log(i+"×"+j+"="+(i*j));
}
}
これをコピペして使いまわしても問題はないが、もう少し深くみていくことにしよう。
まずは普通のループから
最初にconsole.log で、1~9までを出力するプログラムを書くと…
console.log(1);
console.log(2);
console.log(3);
//---- 反復 ----
//---- 9個目 ----
console.log(9);
上記のような感じになる。
しかしながら、このように同じような処理を書くのはかなり面倒ということで、for 文を使用すると…
for(var i =1;i<=9;i++){
//9コのconsole.logをまとめた
console.log(i);}
…とここまでは、よく見かけてきたのではないだろうか。
それでは、これをさらに for 文で重ねてみたらどうなるだろう。
for 文に for 文を重ねて 2 重ループ
同じように変数 i のfor 文を 9 コ並べてみると以下のようになる
for(var i =1;i<=9;i++){
console.log(i);}
for(var i =1;i<=9;i++){
console.log(i);}
for(var i =1;i<=9;i++){
console.log(i);}
//---- 反復 ----
//---- 9個目 ----
for(var i =1;i<=9;i++){
console.log(i);}
先ほどの例と比べてみると
console.log(i)
から
for(var i =1;i<=9;i++) {console.log(i);}
に置き換わったことになる。
文で見ると、console.logの出力にただ単に for 文がくっついただけ という風に考えることができる。
これもいちいち書くのは面倒なので、変数 j で for に直すと以下のようになる
for(var j =1;j<=9;j++){
// 変数 i の 9 コの for 文をまとめた
for(var i =1;i<=9;i++){
console.log(i);}
}
for 文の中に for 文が入って、最初に示した二重ループが完成した。
ただ、これだと 1~9 を 9 回繰り返して出力することになるので console.log の部分を掛け算 i+"×"+j+"="+(i*j) に置き換えると…
for(var i=1;i<=9;i++){
// i と j を入れ替え
for(var j=1;j<=9;j++){
console.log(i+"×"+j+"="+(i*j));
}
}
これで、最初に示した九九のプログラムの完成！！
多次元配列で各要素を取り出す
var array = [[1,3,5],[2,4,6,8],[10]];
// 二重ループでどんな形の配列も出力
for (var i = 0;i<array.length;i++){
for (var j = 0;j<array[i].length;j++){
console.log(array[i][j]);
}
}
length メソッドを使えば、どんなに各配列の要素数が違っていても臨機応変に出力できる。（言語によりメソッドが異なることがあるので注意）
まずは普通に取り出してみる
先ほどと同様に、まずは普通に各要素を console.log で取り出してみると次のようになる
var array = [[1,3,5],[2,4,6,8],[10]];
// 各要素の取り出し方
//array[0] →[1,3,5]
console.log(array[0][0]); //1
console.log(array[0][1]); //3
console.log(array[0][2]); //5
//array[1] →[2,4,6,8]
console.log(array[1][0]); //2
console.log(array[1][1]); //4
console.log(array[1][2]); //6
console.log(array[1][3]); //8
//array[2] →[10]
console.log(array[2][0]); //10
length メソッドで配列の中の要素数を返すので、これを使って for 文で表してみる。
2 重ループで表してみる
まずは各配列 (array[hoge]) の中身 を for 文で表すと、以下のようになる。
for (var j = 0;j<array[0].length;j++){
console.log(array[0][j]);}
for (var j = 0;j<array[1].length;j++){
console.log(array[1][j]);}
for (var j = 0;j<array[2].length;j++){
console.log(array[2][j]);}
これからさらに配列全体 (array)を for 文で表すと、以下のようになる。
for (var i = 0;i<array.length;i++){
for (var j = 0;j<array[i].length;j++){
console.log(array[i][j]);
}
}
どんなに各配列の要素数が違っていても臨機応変に出力できるのはかなりの強み。各ページによって構成がまちまちなことは珍しくないので、このようなプログラムを組む機会は恐らく少なくないはず。
ループ処理には他に while 文があるが、それはまた機会があるときに別の記事として投稿することにしよう。投稿が終わり次第、ここにリンクを示しておくことに。
まとめ
- for 文は繰り返しを楽にする
- if 文と同様に true/false に注意すること
- length と組み合わせると柔軟な出力ができる