将对象数组转换为另一个对象数组答案

【问题标题】：Transform array of objects to another array of objects将对象数组转换为另一个对象数组
【发布时间】：2021-12-13 05:29:08
【问题描述】：

我目前正在努力转换一组对象以满足我的需要。

我的初始数组如下所示：

 [{
    "adId": "uuid"
    "carBrand": "audi",
    "carColor: "blue",
    "carType": "sedan"
    "yearOfProduction": 1999,
    "price": 10.000
  },{
    "adId": "uuid"
    "carBrand": "mercedes",
    "carColor: "yellow",
    "carType": "coupe"
    "yearOfProduction": 2004,
    "price": 14.000
  },{
    "adId": "uuid"
    "carBrand": "bmw",
    "carColor: "green",
    "carType": "minivan"
    "yearOfProduction": 2007,
    "price": 6.000
 }]

我希望我的新数组如下所示：

[{
    "adId": "uuid"
    "carBrand": "audi",
    "carColor: "blue"
},{
    "adId": "uuid"
    "carBrand": "audi",
    "carType: "sedan"
},{
    "adId": "uuid"
    "carBrand": "audi",
    "yearOfProduction: "1999"
},{
    "adId": "uuid"
    "carBrand": "audi",
    "price: 10.000
},
{
    "adId": "uuid"
    "carBrand": "mercedes",
    "carColor: "yellow"
},{
    "adId": "uuid"
    "carBrand": "mercedes",
    "carType: "coupe"
},{
    "adId": "uuid"
    "carBrand": "mercedes",
    "yearOfProduction: "2004"
},{
    "adId": "uuid"
    "carBrand": "mercedes",
    "price: 14.000
},
    {
    "adId": "uuid"
    "carBrand": "bmw",
    "carColor: "green"
},{
    "adId": "uuid"
    "carBrand": "bmw",
    "carType": "minivan"
},{
    "adId": "uuid"
    "carBrand": "bmw",
    "yearOfProduction": 2007,
},{
    "adId": "uuid"
    "carBrand": "bmw",
    "price": 6.000
}]

所以基本上“adId”和“carBrand”属性将出现在每个新对象上，以及剩下的每个属性。我用 lodash 尝试了各种场景，但我根本做不到。欢迎任何建议和提示，干杯。

【问题讨论】：

标签： javascript arrays object lodash

【解决方案1】：

forEach 可以帮助您：

const array =  [{
    "adId": "uuid",
    "carBrand": "audi",
    "carColor": "blue",
    "carType": "sedan",
    "yearOfProduction": 1999,
    "price": 10.000
  },{
    "adId": "uuid",
    "carBrand": "mercedes",
    "carColor": "yellow",
    "carType": "coupe",
    "yearOfProduction": 2004,
    "price": 14.000
  },{
    "adId": "uuid",
    "carBrand": "bmw",
    "carColor": "green",
    "carType": "minivan",
    "yearOfProduction": 2007,
    "price": 6.000
 }]

 const newArray = []
 array.forEach(el=> {
    newArray.push({adId: el.adId, carBrand: el.carBrand, carColor: el.carColor})
    newArray.push({adId: el.adId, carBrand: el.carBrand, carType: el.carType})
    newArray.push({adId: el.adId, carBrand: el.carBrand, yearOfProduction: el.yearOfProduction})
    newArray.push({adId: el.adId, carBrand: el.carBrand, price: el.price})
 })

 console.log(newArray)

【讨论】：

【解决方案2】：

您可以使用flatMap 和Object.entries 轻松实现结果

单线

arr.flatMap(({ adId, carBrand, ...rest }) => Object.entries(rest).map(([k, v]) => ({ adId, carBrand, [k]: v })))

const arr = [
  {
    adId: "uuid",
    carBrand: "audi",
    carColor: "blue",
    carType: "sedan",
    yearOfProduction: 1999,
    price: 10.0,
  },
  {
    adId: "uuid",
    carBrand: "mercedes",
    carColor: "yellow",
    carType: "coupe",
    yearOfProduction: 2004,
    price: 14.0,
  },
  {
    adId: "uuid",
    carBrand: "bmw",
    carColor: "green",
    carType: "minivan",
    yearOfProduction: 2007,
    price: 6.0,
  },
];

const result = arr.flatMap(({ adId, carBrand, ...rest }) => {
  return Object.entries(rest).map(([k, v]) => ({ adId, carBrand, [k]: v }));
});

console.log(result);

【讨论】：

【解决方案3】：

Destructuring 可用于隔离您知道所需的属性，同时保持对象的 ...rest 不变以供进一步迭代。

这里在外循环中隔离adId和carBrand，然后迭代对象其余部分的Object.entries()来构造新对象。 Computed property assignment 允许我们从变量中分配属性（这里的迭代器中的 k）。然后将每个新对象推入带有push() 的结果数组中。

const arr = [{ adId: 'uuid', carBrand: 'audi', carColor: 'blue', carType: 'sedan', yearOfProduction: 1999, price: 10.0, }, { adId: 'uuid', carBrand: 'mercedes', carColor: 'yellow', carType: 'coupe', yearOfProduction: 2004, price: 14.0, }, { adId: 'uuid', carBrand: 'bmw', carColor: 'green', carType: 'minivan', yearOfProduction: 2007, price: 6.0, },];

const result = [];
for (const { adId, carBrand, ...rest } of arr) {
  for (const [k, v] of Object.entries(rest)) {
    result.push({ adId, carBrand, [k]: v });
  }
}

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：