#map()の使い方
map()
は、配列すべての要素に対して、コールバック関数を実行してその返り値で新しい配列が生成される。map()
の基本的な書き方は以下となる。
// arrayは配列
array.map((value, index, array) => {
// 処理内容
});
上記のようにコールバック関数は以下の3つの引数を取る。ただし、index
とarray
については省略可能。
■ value : 配列の要素
■ index : 配列のインデックス
■ array : 処理対象の配列
map()
を使って配列の要素を2乗するだけの簡単なサンプルが以下となる。
const array = [1, 7, 12, 15];
const result = array.map((value) => {
return value * value;
});
console.log(result); // [ 1, 49, 144, 225 ]
forEach()とmap()の違い
forEach()
とmap()
の違いは、実行結果を新しい配列として返すかどうか。
map()
は、コールバック関数の返り値で新しい配列が生成される一方で、forEach()
は単純に処理を実行するだけで返り値がないため、return
を記述してもforEach()
の結果はundefined
が返される。
MDN Web Docsには、map()
を使用すべきではない場合として2点挙げられていた。(参考: MDN Web Docs)
● 返された配列を使用しない場合
● コールバックから値を返さない場合