Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【JavaScript ECMAScript】Object::Object.groupBy静的メソッドの使い方

Object.groupBy()静的メソッドの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

Object.groupBy()メソッドは、指定されたイテラブルなオブジェクトの要素を、提供されたグルーピング関数に基づいてグループ化し、新しいオブジェクトを生成するメソッドです。このメソッドは、配列のような複数の要素を持つデータ構造に対して、特定の条件に基づいて要素を分類し、整理する際に非常に役立ちます。

具体的には、第一引数としてグループ化したい要素を持つイテラブルなオブジェクト(例えば配列)を受け取ります。第二引数には、各要素をどのグループに分類するかを決定するためのコールバック関数を渡します。このコールバック関数は、イテラブルの各要素に対して一度ずつ実行され、その要素が属するグループのキー(文字列またはシンボル)を返します。

Object.groupBy()は、返されたキーを新しいオブジェクトのプロパティ名として使用し、同じキーを持つすべての要素を配列としてそのプロパティの値に格納します。これにより、元のイテラブルの要素が、定義した条件に基づいて意味のあるグループに再編成された新しいオブジェクトが得られます。例えば、商品データのリストをカテゴリ別に分類したり、ユーザーデータを地域別に整理したりする場面で、簡潔かつ効率的なデータ処理を実現できます。ECMAScriptの比較的新しい機能として、データの集計や加工をより直感的に行うための強力なツールとして活用されています。

公式リファレンス: Object.groupBy()

構文(syntax)

1const items = [
2  { id: 1, category: 'fruit', name: 'apple' },
3  { id: 2, category: 'vegetable', name: 'carrot' },
4  { id: 3, category: 'fruit', name: 'banana' },
5  { id: 4, category: 'dairy', name: 'milk' }
6];
7
8const groupedByCategory = Object.groupBy(items, (item) => item.category);

引数(parameters)

items, callbackFn

  • items: Array or Iterable: グループ化する対象の配列またはイテラブルオブジェクト
  • callbackFn: Function: 各要素を処理し、グループ化のキーを返すコールバック関数

戻り値(return)

Object

指定された配列を、提供された関数によって生成されたキーに基づいてグループ化された新しいオブジェクトを返します。

関連コンテンツ

関連プログラミング言語