Vanilla JS と Lodash で連想配列を GROUP BY + SUM する

1. はじめに

本記事では，JavaScript を用いて以下ような連想配列を GROUP BY + SUM する方法について考えます。様々な実装方法が考えられますが，本記事では Vanilla JS を用いた方法とユーティリティライブラリである Lodash を用いた方法について記述します。

1
# 処理前
2

3
[
4
    { date: '2020-01-01', sales: 100 },
5
    { date: '2020-01-01', sales: 200 },
6
    { date: '2020-01-01', sales: 300 },
7
    { date: '2020-01-02', sales: 100 },
8
    { date: '2020-01-02', sales: 200 },
9
    { date: '2020-01-03', sales: 100 },
10
]
11

12
# 処理後
13

14
[
15
    { date: '2020-01-01', sales: 600 },
16
    { date: '2020-01-02', sales: 300 },
17
    { date: '2020-01-03', sales: 100 },
18
]

本記事内で行っている作業は以下の環境下で実行したものです。また，Node.js や Lodash はインストール済みの前提で記述しており，インストール手順は割愛していることをご了承ください。

Lodash Ver.4.17.19
Node.js Ver.12.18.1
Zorin OS 15.2 Core (Ubuntu 18.04 LTS)

2. Vanilla JS

様々な実装が考えられますが，今回はインターネットで公開されている記事を参考に，reduce と find を用いることで GROUP BY + SUM を実装しています。

1
const before = [
2
  { date: '2020-01-01', sales: 100 },
3
  { date: '2020-01-01', sales: 200 },
4
  { date: '2020-01-01', sales: 300 },
5
  { date: '2020-01-02', sales: 100 },
6
  { date: '2020-01-02', sales: 200 },
7
  { date: '2020-01-03', sales: 100 },
8
]
9

10
const after = before.reduce((acc, crt) => {
11
  const result = acc.find((elem) => {
12
    return elem.date === crt.date
13
  })
14
  if (result) {
15
    result.sales += crt.sales
16
  } else {
17
    acc.push({
18
      date: crt.date,
19
      sales: crt.sales,
20
    })
21
  }
22
  return acc
23
}, [])
24

25
console.log(after)

上記のソースコードを app.js というファイル名で任意のフォルダ内に保存します。app.js を実行すると，正常に GROUP BY + SUM されていることが確認できました。

1
$ node app.js
2
[
3
  { date: '2020-01-01', sales: 600 },
4
  { date: '2020-01-02', sales: 300 },
5
  { date: '2020-01-03', sales: 100 }
6
]

3. Lodash

こちらも Vanilla JS 同様に様々な実装が考えられますが，今回は Lodash が提供している groupBy と map，sumBy を組み合わせて GROUP BY + SUM を実装しました。

1
const _ = require('lodash')
2

3
const before = [
4
  { date: '2020-01-01', sales: 100 },
5
  { date: '2020-01-01', sales: 200 },
6
  { date: '2020-01-01', sales: 300 },
7
  { date: '2020-01-02', sales: 100 },
8
  { date: '2020-01-02', sales: 200 },
9
  { date: '2020-01-03', sales: 100 },
10
]
11

12
const after = _(before)
13
  .groupBy('date')
14
  .map((value, key) => {
15
    return {
16
      date: key,
17
      sales: _.sumBy(value, 'sales'),
18
    }
19
  })
20
  .value()
21

22
console.log(after)

1
$ node app.js
2
[
3
  { date: '2020-01-01', sales: 600 },
4
  { date: '2020-01-02', sales: 300 },
5
  { date: '2020-01-03', sales: 100 }
6
]

4. おわりに

ここまで，Vanilla JS と Lodash を用いて GROUP BY + SUM する方法について記述してきました。Lodash を用いて実装したソースコードの方が直感的で理解しやすい印象を受けました。今回は実行速度を計測していないため，パフォーマンスの観点から比較することが出来ていません。