ES2024: Object.groupBy/Map.groupBy

[azu]

tc39/proposal-array-grouping: A proposal to make grouping of array items easier

Web互換性のためにObject.groupByになった。
Map.groupBy(array, fn)もある。

グループ化は頻出ではあるので含めるのは妥当そうだけど、配置が難しい

• Array.prototype.group → Object.groupBy(array, cb)
• Array.prototype.groupToMap → Map.groupBy(array, cb)

という経緯。
どちらも配列を引数として受け取るようになってるので、配列関係。

データの変換的に見れば

• Object.groupBy は 配列をオブジェクトにするメソッド
• Map.groupBy は配列をMapにするメソッド

として捉えられる。

Object.groupByは、 配列 to objectなので、Array.prototype.reduce の近くにあるのが良さそう。
Map.groupByは、Map/Setにあるのが良さそう。
Map.groupByはちょっと必要かは怪しい。

TODO

• Object.groupBy: 配列の章に追加する
• Map.groupBy は Map/Setの章に追加する?

Originally posted by @azu in #1706 (comment)

[azu]

@koralle 配列の章とMap/Setの章は別々のPRとして進めるのが良いと思います。(Assignするためにmentionしちゃいましたが、なぜかAssignはできなかった…)

[azu]

• ユースケース/モチベーションの整理
• 他の書籍やサイトなどでの紹介例を集める(MDNとかEloquent JavaScriptとかhttps://javascript.info/ とかブログとか)
• ユースケースの章でgroupByを使うべき場所がないかを確認する
• わかりやすくシンプルなExampleを考える
• 文章として追加する

作業としては毎回こういうイメージのことをやっています。

ちょっと考えるところとしては、Web互換性のためにStatic Methodになってるというのを説明するべきかどうかという点ぐらいなのかなとは思います。(多分冗長になるので不要になりそうな気はしています)

• Why static methods?

参考

• https://github.com/asciidwango/js-primer/issues?q=is%3Aissue+is%3Aclosed+label%3A%22Lang%3A+ES2022%22+
• https://github.com/asciidwango/js-primer/issues?q=is%3Aissue+is%3Aclosed+label%3A%22Lang%3A+ES2021%22
• https://github.com/asciidwango/js-primer/issues?q=is%3Aissue+is%3Aclosed+label%3A%22Lang%3A+ES2020%22

[koralle]

@azu
ありがとうございます。

[azu]

• feat(array): Object.groupBy 静的メソッドを追加  #1749

配列の方を追加しました。
Mapの方がまだあるので、re-open

[azu]

Mapの方もiterateの流れで入れるのが正しそう。
https://jsprimer.net/basic/map-and-set/#map-iteration

[azu]

Mapを読んでいてショッピングカートの例がちょっと冗長な感じがしたので別のissueを作りました

• Map/Setからショッピングカートの例を削除する #1750

[azu]

• feat(array): Object.groupBy 静的メソッドを追加  #1749
• feat(map-and-set): Map.groupBy静的メソッドの追加 #1751

それぞれ追加したのでcloseします。

ES2025でSet MethodsとIterator Helpersがくるので、そこでMap/Setは大きく書き直しが必要になるかもしれません