如何在 JavaScript 中以多個屬性和聚合值對物件進行分組？

以多個屬性將物件分組並聚合值

在以多個屬性將陣列中的物件分組的任務中，一個常見的要求是不僅可以依這些屬性分組，還可以對某些物件屬性的值進行求和。然而，簡單地將所有重複項嵌套在二維數組中的解決方案是不夠的。

問題陳述

考慮一個必須按形狀分組的物件數組，並且顏色。只有當該數組中的物件的形狀和顏色相同時，才會將其視為重複物件。對於重複的對象，我們需要總結它們的使用值和實例值，並刪除重複項，從而得到具有獨特形狀和顏色的簡潔對象列表。

解

為了有效解決這個問題，我們可以利用 Array#reduce方法結合追蹤遇到的形狀和顏色的輔助物件組合：

const arr = [
  { shape: 'square', color: 'red', used: 1, instances: 1 },
  { shape: 'square', color: 'red', used: 2, instances: 1 },
  { shape: 'circle', color: 'blue', used: 0, instances: 0 },
  { shape: 'square', color: 'blue', used: 4, instances: 4 },
  { shape: 'circle', color: 'red', used: 1, instances: 1 },
  { shape: 'circle', color: 'red', used: 1, instances: 0 },
  { shape: 'square', color: 'blue', used: 4, instances: 5 },
  { shape: 'square', color: 'red', used: 2, instances: 1 },
];

const helper = {};
const result = arr.reduce((r, o) => {
  const key = `${o.shape}-${o.color}`;

  if (!helper[key]) {
    // If it's a unique combination, add to the helper and result array
    helper[key] = Object.assign({}, o);
    r.push(helper[key]);
  } else {
    // If it's a duplicate, update the values in the helper
    helper[key].used += o.used;
    helper[key].instances += o.instances;
  }

  return r;
}, []);

console.log(result);

輸出：

[
  { shape: "square", color: "red", used: 5, instances: 3 },
  { shape: "circle", color: "red", used: 2, instances: 1 },
  { shape: "square", color: "blue", used: 11, instances: 9 },
  { shape: "circle", color: "blue", used: 0, instances: 0 }
]

此解決方案有效地按形狀和顏色對物件進行分組，聚合重複物件的使用值和實例值，並刪除所有剩餘的重複項，從而得到所需的輸出。

以上是如何在 JavaScript 中以多個屬性和聚合值對物件進行分組？的詳細內容。更多資訊請關注PHP中文網其他相關文章！