javascript - 在javascript中将数组本身合并到另一个具有相同键的数组中

Question

我正在尝试合并数组本身并将其转换为更有意义的数组

array = [
{item: 'pen', madeIn: 'US', color: 'blue'},
{item: 'pen', madeIn: 'US', color: 'white'},
{item: 'pen', madeIn: 'China', color: 'red'},
{item: 'pen', madeIn: 'China', color: 'white'}
]

我要生成的输出数组:

outputArray = [
{item: 'pen', madeIn: 'US', color: ['blue', 'white']},
{item: 'pen', madeIn: 'China', color: ['red', 'white']}
];

我一直在尝试但没有运气，目前我能想到的唯一解决方案是使用临时变量来存储项目和 madeIn 值。然后运行另一个循环来比较 item 和 madeIn，然后将颜色添加到数组中。有几个循环可以解决这个问题。

我的意思是它确实有效，但绝对不是最佳解决方案。 欢迎任何其他理想。谢谢。

Answer 1

Reduce使用 item 和 madeIn 属性创建键的对象数组。对于每个对象，检查键是否已经存在，如果不存在，则为具有属性 color 的键创建一个新对象作为一个空数组。将每个对象的 color 推送到数组。使用 Object.values()将对象转换为数组。

const array = [{"item":"pen","madeIn":"US","color":"blue"},{"item":"pen","madeIn":"US","color":"white"},{"item":"pen","madeIn":"China","color":"red"},{"item":"pen","madeIn":"China","color":"white"}]

const result = Object.values(
  array.reduce((r, o) => {
    const key = `${o.item}-${o.madeIn}`
    
    if(!r[key]) r[key] = { ...o, color: [] }
    
    r[key].color.push(o.color)
    
    return r;
  }, {})
)

console.log(result)