如何在 JavaScript 物件陣列中合併重複的鍵並對它們的值求和？

合併物件陣列中的重複鍵並對值求和

在 JavaScript 中，處理物件陣列很常見。有時，我們可能會遇到需要將陣列中的物件分組和修改，同時保留特定屬性的情況。其中一個場景涉及對與相似鍵關聯的值進行求和。

讓我們透過一個範例物件陣列來探索此任務：

const objects = [
  { name: 'P1', value: 150 },
  { name: 'P1', value: 150 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

我們的目標是按「名稱」屬性對物件進行分組並對每個不同「名稱」的“值”屬性求和。所需的輸出應如下所示：

[
  { name: 'P1', value: 300 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

為了實現這一點，我們可以利用 JavaScript 的物件和陣列操作功能。這是一個逐步解決方案：

1.建立一個物件來儲存求和值

先建立一個名為「holder」的空JavaScript 對象，該物件將用作儲存每個「名稱」的求和值的容器。

2.迭代輸入陣列

使用「forEach」循環迭代輸入陣列中的每個物件（「objects」）。

3.檢查「holder」中是否存在名稱

在循環內，使用「hasOwnProperty(d.name)」檢查目前物件的「name」屬性是否已作為屬性存在於“ holder」物件中。

4.求和或初始化值

如果'name' 屬性存在，則將目前物件的'value' 屬性加到'holder' 中的對應屬性（例如'holder[d .name] = d.value '）。如果未找到「name」屬性，則使用目前物件的「value」屬性對其進行初始化（「holder[d.name] = d.value」）。

5.建立包含合併物件的新陣列

將所有值相加後，建立一個名為「obj2」的新空數組來儲存合併的物件。

6.迭代「holder」並推送合併物件

使用另一個循環迭代「holder」物件的屬性（「for (var prop inholder)」）。對於每個屬性，建立一個具有「name」和「value」屬性的新對象，並將其推入「obj2」。

7.記錄輸出

最後，將「obj2」陣列記錄到控制台以查看具有總和「value」屬性的合併物件。

範例程式碼

這裡是一個程式碼片段示範了解決方案：

const objects = [
  { name: 'P1', value: 150 },
  { name: 'P1', value: 150 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];

const holder = {};

objects.forEach(d => {
  if (holder.hasOwnProperty(d.name)) {
    holder[d.name] += d.value;
  } else {
    holder[d.name] = d.value;
  }
});

const obj2 = [];

for (var prop in holder) {
  obj2.push({ name: prop, value: holder[prop] });
}

console.log(obj2);

透過執行以下步驟，您可以有效地將與相似的關聯值分組和求和物件陣列中的鍵，根據所需的輸出建立一個包含修改後的物件的新陣列。

以上是如何在 JavaScript 物件陣列中合併重複的鍵並對它們的值求和？的詳細內容。更多資訊請關注PHP中文網其他相關文章！