JavaScript - forEach() を使った配列のループ

JavaScript では for 文、white 文を使った配列のループ方法以外にも、 forEach()、map()、filter() などのメソッドを使ったループ方法もあります。

ここでは、forEach() メソッドを使った配列のループについて説明します。

forEach() メソッドの概要

forEach() メソッドは、配列を巡回しながら、要素ごとに指定された関数を呼び出します。

forEach() メソッドの引数として指定された関数は、3つの引数(値、配列のインデックス、配列自身)を持ちます。

つまり、次のような書き方となります。


配列.forEach(function(value, index, array){
	// 処理
});

「配列要素の値」だけ必要な場合は、次のように引数を省略できます。


配列.forEach(function(value){
	// 処理
});

forEach() のサンプルコード

配列要素の総和を求める

次のコードは、配列の要素の総和を求めています。 引数として必要なのは「配列要素の値」だけです。


var arr = [1, 2, 3, 4, 5];
var sum = 0;

arr.forEach(function(v){
	sum += v;
})

console.log(sum); // 15

配列の各要素を自乗する

次のコードは、配列の各要素を自乗します。 引数として値、配列のインデックス、配列自身の3つを記述しています。


var arr = [1, 2, 3, 4, 5];

arr.forEach(function(v, i, a){
	a[i] = v * v;
})

console.log(arr); // Array [ 1, 4, 9, 16, 25 ]

このように、forEach() メソッドを使うことで、 関数型のプログラミングスタイルで処理を行うことができます。

forEach() の注意点: break、continue が使えない

forEach() を使う場合の注意点として、次の2点があります。

  • break 文が使えない
  • continue 文が使えない

ですから、途中で中断処理やスキップを行う必要がある場合は、 forEach() を使わずに、for 文を使った方が良いでしょう。

まとめ

forEach() メソッドは、配列を巡回しながら、要素ごとに指定された関数を呼び出します。

指定された関数には値、インデックス、配列自身の3つの引数があります。

forEach() メソッドでは break 文、continue 文は使えません。