731 words
4 minutes
Vanilla JS と Lodash で連想配列を GROUP BY + SUM する
2020-07-08
2020-12-15

1. はじめに#

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

# 処理前
[
{ date: '2020-01-01', sales: 100 },
{ date: '2020-01-01', sales: 200 },
{ date: '2020-01-01', sales: 300 },
{ date: '2020-01-02', sales: 100 },
{ date: '2020-01-02', sales: 200 },
{ date: '2020-01-03', sales: 100 },
]
# 処理後
[
{ date: '2020-01-01', sales: 600 },
{ date: '2020-01-02', sales: 300 },
{ date: '2020-01-03', sales: 100 },
]

本記事内で行っている作業は以下の環境下で実行したものです。また,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#

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

const before = [
{ date: '2020-01-01', sales: 100 },
{ date: '2020-01-01', sales: 200 },
{ date: '2020-01-01', sales: 300 },
{ date: '2020-01-02', sales: 100 },
{ date: '2020-01-02', sales: 200 },
{ date: '2020-01-03', sales: 100 },
]
const after = before.reduce((acc, crt) => {
const result = acc.find((elem) => {
return elem.date === crt.date
})
if (result) {
result.sales += crt.sales
} else {
acc.push({
date: crt.date,
sales: crt.sales,
})
}
return acc
}, [])
console.log(after)

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

$ node app.js
[
{ date: '2020-01-01', sales: 600 },
{ date: '2020-01-02', sales: 300 },
{ date: '2020-01-03', sales: 100 }
]

3. Lodash#

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

const _ = require('lodash')
const before = [
{ date: '2020-01-01', sales: 100 },
{ date: '2020-01-01', sales: 200 },
{ date: '2020-01-01', sales: 300 },
{ date: '2020-01-02', sales: 100 },
{ date: '2020-01-02', sales: 200 },
{ date: '2020-01-03', sales: 100 },
]
const after = _(before)
.groupBy('date')
.map((value, key) => {
return {
date: key,
sales: _.sumBy(value, 'sales'),
}
})
.value()
console.log(after)

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

$ node app.js
[
{ date: '2020-01-01', sales: 600 },
{ date: '2020-01-02', sales: 300 },
{ date: '2020-01-03', sales: 100 }
]

4. おわりに#

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