配列から要素を一つづつ取り出す処理をmapで記述していたが、forEachで簡単に記述できることが判明。
ついでに、主なループ処理の使い所もまとめた個人用メモです。
| 項目 | メソッド/文 | 使い所 |
|---|---|---|
| for | 文 | 回数を指定したい場合 |
| for of | 文 | 要素を一つ一つ抜き出したい場合。クロージャ（closure）でないので、定義した変数がグローバル（処理の外でも有効）になる。 |
| forEach | メソッド | 要素を一つ一つ抜き出したい場合。クロージャ（closure）なので、定義した変数はローカル。余計な変数が増えない。 |
| map | メソッド | 要素を一つ一つ抜き出し処理を加え、結果を配列で返す。非破壊。 |
| reduce | メソッド | 要素を一つ一つ抜き出し処理し、一意の値を返す。非破壊。一つの値が欲しい場合に使う。 |
| filter | メソッド | 要素を一つ一つ抜き出し、条件がtrueとなった要素のみ残す。非破壊 |
| for in | 文 | 対象がオブジェクト。配列ではない。 |
いずれもループで回すので、使い方によっては同じ処理ができるが、目的とする用途が異なる。
##どれを使うかの基準 大きなポイントは以下２点。
(1) メソッドか文か？
余計な変数を増やしたくない場合や、処理内でのみ変数を定義したい場合はメソッドを使う。
メソッドは変数を一旦クリアする文処理量は増えるが、閉じた空間で変数を使うので処理がわかりやすくなる。
(2) 出力は何か？
要素を一つづつ取り出し、元の配列に依存しない処理結果を返したい場合はforやforEachを使う。
元の要素を一つ一つ変換したい場合はmap。
各要素を使った処理結果から一つの値をえたい場合はreduce。
特定の要素のみ残したい場合はfilterを使う。
##ループの実例 要素を一つづつ取り出しconsole.logで出力するプログラムはいずれのメソッド・文でもできる。
forEach
arr = [1,2,3,4]
arr.forEach( (elem, index) => {
console.log(elem)
})
//出力
1
2
3
4
処理がクローズドの環境なのでわかりやすい。
map
arr = [1,2,3,4]
_arr = arr.map( (elem, index) => {
console.log(elem)
})
//出力
1
2
3
4
不要な変数_arrができてしまうため、新たな配列を作る必要がない場合は不向き。
for-of
arr = [1,2,3,4]
for( elem of arr ){
console.log(elem)
}
//出力
1
2
3
4
forEachとほぼ同じ。メソッドか文かの違い。
処理の中でグローバルな（処理の外でも使える）変数を宣言したい場合に有効。
for
arr = [1,2,3,4]
for(i = 0; i < arr.length; i ++ ){
console.log(arr[i])
}
//出力
1
2
3
4
繰り返す回数に特化した処理。「n回繰り返したい」という場合に有効。
reduce
arr = [1,2,3,4]
_arr = arr.reduce( (res, elem, index) => {
console.log(elem)
}, arr[0])
//出力
1
2
3
4
一つの結果を得る場合に使うのがreduce。今回の用途では余計な変数_arrが増えるので不向き。
filter
arr = [1,2,3,4]
_arr = arr.filter( (elem, index) => {
console.log(elem)
})
//出力
1
2
3
4
trueになった要素のみ抜き出すfilter。今回の用途では余計な変数_arrが増えるので不向き。
##まとめ
単に要素を一つづつ抜き出すという目的であれば、forEachかfor-ofに絞られる。
クロージャで処理を完結に書きたければforEachを使うのがベスト。