JavaScriptでループ処理
こんにちは。ayabouzuです。phpのループ処理は、そんなに抵抗なく出来るんですけど、
JavaScriptだと、よく分からないなあと感じることが多かったので、記事にして、復習しようと思っています。また、初学者の方の参考になれば、嬉しいです。
reduce
reduce関数ですが、結構、使える関数なので、良かったら、覚えてしまいましょう。
var numbers = [1,2,3,4,5,6,7,8,9];
var result = numbers.reduce(function(a, b) {
return a + b;
})
上をconsole.log(result)すると、
45
と答えが返ってきます！！
中で起こっている事は以下になります。
1+2=3 (a+b)(この３が次のaとなる)
3+3=6 (a+b)
6+4=10 (a+b)
10+5=15
15+6=21
21+7=28
28+8=36
36+9=45
//ここで終了
要は、合計値を求めてくれているんですね。便利だと思いませんか？
for ループ処理
ちなみにfor文で記述すると以下になります。
var total = 0;
for(let i=0; i<10;i++){
total += i;
}
console.log(total);
//45
reduceは応用が効く
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var result = numbers.reduce(function (a, b, index, arr) {
if (index >= 3) arr.splice(2);
return a + b;
});
document.write(result);
document.write(" " + numbers);
上のsplice関数っていうのが、()の中以降のインデックス番号の数字を全て削除しますよという意味になります。上の例だと、配列の中の３番目の数値である４を通過した時点で、２番目以降の配列の値を全て削除してしまいます。
numbers = [1,2,3,4];
/*合計値を求めると、10の値が返ってきます。試しに配列の中身をみてみると、1,2と返されました。
つまり、インデックスが３を超えたら、繰り返し処理から抜けると言うことになりますね。このように、break文のように使うことも可能なんです。ちなみに、今回は、インデックス番号は１から始まっています。
*/
オブジェクト指向型言語のメリットっていうのは、引数をいくつも設定出来る、関数を呼び出せば、何度も繰り返し使える、そこに尽きるんですかねー？私も、まだまだペーペーですが、引き続き、Jsを鍛えていこうと考えています。
私のYouTube動画、是非見てやってください！！