[英]Javascript: Transform array of object response via lodash or underscore or corejavascript
我正在與highChart一起創建柱形圖。 我通過與數據庫的通信達到創建以下arrayofObj的方式。
現在,我需要將對象的以下source
數組轉換為下面的輸出。
var source = [
{data: 258, name: '2014'}
{data: 18, name: '2016'}
{data: 516, name: '2014'}
{data: 0, name: '2014'}
{data: 354, name: '2014'}
{data: 18, name: '2016'}
]`
將此對象數組轉換為
Output
[{
name: '2014',
data: [258, 516, 354]
}, {
name: '2016',
data: [18, 0, 18]
}]
基本上,我希望我的數組按名稱(年份)分組,並且數據應該在數組中
這是我已經應用的解決方案。
var source = [];
_.each(source, function(singlerec) {
source.push({
name: singlerec.name,
data: singlerec.data // Here It only assign single record
});
});
在Lodash中,我總是使用_.groupBy
,然后使用_.groupBy
_.map
為輸出格式。
var source = [{"data":258,"name":"2014"},{"data":18,"name":"2016"},{"data":516,"name":"2014"},{"data":0,"name":"2014"},{"data":354,"name":"2014"},{"data":18,"name":"2016"}]; var output = _(source) .groupBy('name') .map(function(v, k) { return { name: k, data: _.map(v, 'data') } }) .value(); console.log(output);
<script src="https://cdn.jsdelivr.net/lodash/4.13.1/lodash.min.js"></script>
我使用純JavaScript函數:
const pick = (obj, paths) => ({...paths.reduce((a, k) => ({...a, [k]: obj[k]}), {})})
function groupByAndConcat(data, groupBy, sums) {
return data.reduce((results, r) => {
const e = results.find((x) => groupBy.every((g) => x[g] === r[g]));
if (e) {
sums.forEach((k) => e[k] = [].concat(e[k], r[k]));
} else {
results.push(pick(r, groupBy.concat(sums)));
}
return results;
}, []);
}
因此,鑒於您的示例來源:
const source = [
{data: 258, name: '2014'},
{data: 18, name: '2016'},
{data: 516, name: '2014'},
{data: 0, name: '2014'},
{data: 354, name: '2014'},
{data: 18, name: '2016'},
];
console.log(groupByAndConcat(source, ["name"], ["data"]))
輸出:
[{ name: "2014", data: Array [258, 516, 0, 354] }, { name: "2016", data: Array [18, 18] }]
也可以按幾個道具分組或對其進行操作:
groupByAndConcat(source, ["name","month"], ["data","data2"])
有一種方法可以使用reduce
甚至沒有lodash來迭代一次數組。
source.reduce((p, n) => {
(p[n.name] || (p[n.name] = [])).push(n.data);
return p
}, {})
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.