[Javascript] 連想配列を含む配列データを順番に並べたり重複削除する方法

Javascriptの連想配列データは、単純な配列のように処理する時にちょっとした書き方の技があるので、その方法をサンプルを使ってご紹介。 データベースの取得後のデータなどの処理に便利に使えます。

サンプルデータ

const datas = [ { id : 1, name : "apple", count: 100 }, { id : 2, name : "banana", count : 50 }, { id : 3, name : "orange", count : 10 }, { id : 4, name : "apple", count : 10 }, { id : 5, name : "banana", count : 0 } ]

name値の値一覧をユニークで取得する

Array.from(new Set(datas.map(e => e.name)))

結果

['apple', 'banana', 'orange']

ユニーク化して、値が空を除外する

※nameが空を除外 Array.from(new Set(datas.map(e => e.name))).filter(e => e.name)

name値でソートする

datas.sort((a,b) => {   if(a.name < b.name){return -1}   if(a.name > b.name){return +1} })

結果

[ { "id": 1, "name": "apple", "count": 100 }, { "id": 4, "name": "apple", "count": 10 }, { "id": 2, "name": "banana", "count": 50 }, { "id": 5, "name": "banana", "count": 0 }, { "id": 3, "name": "orange", "count": 10 } ]

名前で重複しているものを統合してcountの値を合計する

Object.values(datas.reduce((res, obj) => { if(res[obj.name]){ res[obj.name].count += obj.count } else{ res[obj.name] = obj } return res }, {}))

結果

[ { "id": 1, "name": "apple", "count": 110 }, { "id": 2, "name": "banana", "count": 50 }, { "id": 3, "name": "orange", "count": 10 } ]