map関数 とは？

たとえば数値の配列を2倍にしたいとき、for文だと「空の配列を用意→ループで計算→pushで追加」と手順を書くけど、mapなら「numbers.map(n => n * 2)」の1行で終わる。「何をしたいか」だけ書けばいいので、コードの意図がはっきりするんだ。

Reactでリストを表示するときが代表例だよ。ユーザーの配列から名前の一覧を作るとか、商品データから商品カードのコンポーネントを作るとか。APIから受け取ったデータを画面表示用のフォーマットに変換するときにもよく使われるね。

mapは「変換」が目的だから、必ず新しい配列を返すんだ。戻り値を使わないなら、mapではなくforEachを使うべきだよ。あとmapの中で非同期処理を使うとPromiseの配列が返ってきて困ることがあるから、その場合はPromise.allで包む必要がある。これはよくある落とし穴だね。

mapは新しい配列を返す、forEachは何も返さない（undefined）。mapは「変換して新しいデータを作る」目的、forEachは「副作用のある処理を実行する」目的。console.logで出力するだけならforEach、データ変換ならmapを使い分けるのが正しいスタイルだよ。

mapした結果を1段階フラットにする関数。例えば[[1,2],[3,4]].flatMap(x => x) は [1,2,3,4] になる。実用的な例では、ユーザーごとの注文リストを1つのフラットな注文リストにまとめるときなどに使う。map + flat を1ステップでやってくれるから、ネストした配列の処理がスッキリ書けるんだ。RxJSやJavaのStreamでも頻出の関数だよ。