使用reduce转换js对象



我想写一个函数来传输这个对象

[
{
"id": "656DDXFT565xX",
"name": "Black item",
"categorues": [
"Black",
"White"
],
"price": 5
}
]

像…一样

[
{
"Black": [
{
"id": "656DDXFT565xX",
"name": "Black item",
"categories": [
"Black",
"White"
],
"price": 5
}
]
},
{
"White": [
{
"id": "656DDXFT565xX",
"name": "Black item",
"categories": [
"Black",
"White"
],
"price": 5
}
]
}
]

我尝试与数组。,但是我不知道如何渲染这个

如果有人对此有任何后见之明

您可以使用.map遍历每个项目的categorues以获得预期的结果。这是一个使用lodash的解决方案:

const data = [
{ "id":"656DDXFT565xX", "name":"Colored item", "categorues":["Black","White"], "price":5 },
{ "id":"656DDXFT565x2", "name":"White item", "categorues":["White"], "price":5 },
{ "id":"656DDXFT565x3", "name":"Black item", "categorues":["Black"], "price":5 }
];
const _reduceElem = (elem={}) => {
const { categorues=[] } = elem;
return _.map( categorues, cat => ({ [cat]: [_.cloneDeep(elem)] }) );
}
const res = _.reduce(data, (acc,item) => {
acc = [...acc, ..._reduceElem(item)];
return acc;
}, []);
console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script>

let before = [
{
"id": "656DDXFT565xX-BW",
"name": "Black and white item",
"categories": [
"Black",
"White"
],
"price": 5
},
{
"id": "656DDXFT565xX-K",
"name": "Black item",
"categories": [
"Black"
],
"price": 10
},
{
"id": "656DDXFT565xX-W",
"name": "White item",
"categories": [
"White"
],
"price": 15
}
]
let after = before.reduce(
(acc, val) => {
val.categories.forEach(cat => {
acc[cat] ||= [] 
// if this fails, use newer version of node, or use
// if(!acc.cat) acc.cat = []

acc[cat].push(val)
})
return acc
},
{}
)
console.log(after)

因为您只想提取categorues作为键。你不需要使用reduce,只需要使用map来循环categorues就可以了。

const origin = [
{
"id": "656DDXFT565xX",
"name": "Black item",
"categorues": [
"Black",
"White"
],
"price": 5
}
]
const categorues = origin[0].categorues;
const result = categorues.map(item => {
return {
[item]: origin
}
})
console.log(result)

最新更新