JavaScript 中合并和分组对象属性

---

在本题中，我们将学习如何使用 JavaScript 合并和分组对象属性。本文将教你如何在 JavaScript 中合并和分组相同类型的属性。

理解问题

我们需要创建一个 JavaScript 方法，该方法将接收一个对象数组作为输入。该函数应分组所有具有 name 属性值的对象的所有属性。例如

输入

[
  {name: 'Adi', age: 22, color:'Black'},
  {name: 'Adi', weight: 40, height:6} ,
  {name: 'Mack', age: 20}
]

输出

[
 {name: 'Adi', age: 22, color:'Black', weight: 40, height:6},
 {name: 'Mack', age: 20}
]

算法 - 使用 reduce 方法

下面提到的算法将逐步介绍解决此问题的过程。

步骤 1：首先定义一个名为 groupedData 的数据数组。在此应用程序中，此数组接收对 reduce() 方法的调用，初始值为一个空对象。参数 acc 和 curr 传递给回调函数。

步骤 2：每次使用 reduce() 方法时，回调函数首先使用解构从 curr 对象中移除 state 属性，然后使用扩展运算符构建一个包含其余属性的新对象。

步骤 3：然后，回调函数确定 state 属性是否以前用作 acc 对象中的键。如果是，则将当前对象的 population 添加到该 state 已有的 population。如果没有，则将 state 和来自 curr 对象的其他属性转移到 acc 对象中的新条目。

步骤 4：结果变量用于使用 Object.values() 方法将 groupedData 对象转换回对象数组。

步骤 5：显示结果输出。

示例

// define a function to check power of 3
const data = [
  { city: "New York", state: "NY", population: 100000 },
  { city: "San Francisco", state: "CA", population: 50000 },
  { city: "Los Angeles", state: "CA", population: 200000 },
  { city: "San Diego", state: "CA", population: 10000 },
  { city: "Chicago", state: "IL", population: 150000 },
  { city: "Miami", state: "FL", population: 5000 }
];

const groupedData = data.reduce((acc, curr) => {
  const { state, ...rest } = curr;
  if (acc[state]) {
   acc[state] = { ...acc[state], population: acc[state].population + curr.population };
  } else {
   acc[state] = { state, ...rest };
  }
  return acc;
}, {});

const result = Object.values(groupedData);

console.log(result);

输出

[
  { state: 'NY', city: 'New York', population: 100000 },
  { state: 'CA', city: 'San Francisco', population: 260000 },
  { state: 'IL', city: 'Chicago', population: 150000 },
  { state: 'FL', city: 'Miami', population: 5000 }
]

算法 - 使用 forEach 方法

使用 forEach 方法的算法步骤如下

步骤 1：第一步，定义一个包含 city、state 和 population 键的数组，并向其中添加一些值。然后，创建一个空数组并将其命名为“groupedData”。

步骤 2：在这个程序中，使用带有名为 obj 的单个参数的回调函数，对 data 数组使用 forEach() 方法。

步骤 3：在 forEach() 方法的每次迭代中，回调函数使用解构从 obj 对象中移除 state 属性，然后使用扩展运算符构建一个包含其余属性的新对象。

步骤 4：回调函数然后确定 state 属性是否曾经用作 groupedData 对象的键。如果是，则将该 state 的人口增加当前项目的 population。如果不是，则将 state 和来自 obj 对象的其他属性添加到 groupedData 对象中的新项目。

步骤 5：使用 Object.values() 函数将 groupedData 对象转换回对象数组，并将其保存在结果变量中。

示例

const data = [
  { city: "New York", state: "NY", population: 100000 },
  { city: "San Francisco", state: "CA", population: 50000 },
  { city: "Los Angeles", state: "CA", population: 200000 },
  { city: "San Diego", state: "CA", population: 10000 },
  { city: "Chicago", state: "IL", population: 150000 },
  { city: "Miami", state: "FL", population: 5000 }
];

const groupedData = {};

data.forEach((obj) => {
  const { state, ...rest } = obj;
  if (groupedData[state]) {
   groupedData[state].population += obj.population;
  } else {
   groupedData[state] = { state, ...rest };
  }
});

const result = Object.values(groupedData);

console.log(result);

时间复杂度

此程序的时间复杂度为 O(n)，其中 n 为数字。这是因为 reduce 和 forEach 函数正在使用数组的长度来产生结果。

因此，此程序的空间复杂度为 O(n)，因为它使用 n 量级的内存来存储数组。

结论

这是解决此类问题的基本思路。在整个过程中，我们使用了 JavaScript 的 reduce 和 forEach 函数、算术运算符和比较运算符来解决问题。并且了解了如何计算算法的时间和空间复杂度。