LoginSignup
14
16

【JavaScript・初学者】map / forEach / filter / findの違い

Last updated at Posted at 2023-11-15

はじめに

Reactを学習していましたが、JavaScriptの記法についてフワッとしている部分がよくあったので、簡単ですが今回は、map / forEach / filter / findの違いについてまとめました

比較

メソッド map forEach
目的 配列の全ての要素を変換する 配列の全ての要素に対して何かを実行する
返り値 変換後の要素からなる新しい配列 なし(undefined)
元の配列への影響 元の配列は変更されない 元の配列は変更されない
使用例 配列の全ての要素を一定のルールで変換する場合など 配列の全ての要素に対して一定の操作を実行する場合など
メソッド filter find
目的 条件に合致する全ての要素を取得する 条件に合致する最初の要素を取得する
返り値 条件に合致する要素からなる新しい配列 条件に合致する最初の要素、なければundefined
元の配列への影響 元の配列は変更されない 元の配列は変更されない
使用例 特定の属性を持つオブジェクトを抽出する場合など IDや一意のキーで特定のオブジェクトを検索する場合など

map / forEach / filter / find

書くメソッドの使い方について個別にまとめているので、参考にしてみてください。

map

forEach

filter

find

14
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
14
16