[JS]mapとforEachの違い

はじめに

JavaScript初学者です。
mapとforEachの違いについて学んだので備忘録として残しておきます。

公式ドキュメント

それぞれ公式ドキュメントから説明を引用させていだだきます。

mapの場合

map() メソッドは、与えられた関数を配列のすべての要素に対して呼び出し、その結果からなる新しい配列を生成します。

foreachの場合

forEach() メソッドは与えられた関数を、配列の各要素に対して一度ずつ実行します。

要するに2つの違いは新しい配列を返すか返さないかということになります。

具体例

forEachの場合

const Array = [1,2,3,4,5]

console.log(Array.forEach(x => x * 2 ))
=> undefined

forEachは処理するだけなので返り値は何もありません

mapの場合

const Array = [1,2,3,4,5];

console.log(Array.map(x => x * 2 ))
=>  [2, 4, 6, 8, 10]

mapは処理をした上で新しい配列を返してくれます。

もしforEachで新しい配列を作りたい場合は以下のようになります。

const Array = [1,2,3,4,5];
const newArray = [];

Array.forEach( x => newArray.push(x * 2) );
console.log(newArray)
=> [2, 4, 6, 8, 10]

まとめ

今回はmapとforEachを比較しましたがmapの方がコードがシンプルかつ新しい配列を返してくれるので便利だし実際mapの使用率の方が高そうです。

しかしforEachの方が処理速度が早いらしいです、また新しい配列を返さないので使い分け考えてコードを書いてみるのも良いかもしれませんね。