首頁  >  文章  >  web前端  >  如何在 jQuery 中使用 Reduce 方法對物件陣列進行分組和求和?

如何在 jQuery 中使用 Reduce 方法對物件陣列進行分組和求和?

Patricia Arquette
Patricia Arquette原創
2024-11-23 06:17:22225瀏覽

How Can You Group and Sum an Array of Objects in jQuery Using the Reduce Method?

在jQuery 中對物件陣列進行分組和求和:詳細指南

將物件陣列中的值進行分組和求和是一項常見任務在程式設計中。在 jQuery 中,可以使用 reduce() 方法有效地實現這一點。

理解目標

目標是根據特定屬性對物件陣列進行分組,在本例中為「Id」屬性。將物件分組後,應將每組的數量(「數量」)相加。

逐步解決方案

  1. 初始化:建立一個名為result的空數組來儲存分組後的結果物件。
  2. 循環遍歷數組:使用reduce()方法迭代數組。此方法採用兩個函數作為參數:

    • 累加器函數:累加先前迭代的結果。它通常表示為 res 或 acc。
    • 值函數: 處理陣列中的目前元素。它通常表示為 value 或 currentValue。
  3. 分組: 在 reduce() 方法中,檢查累加器物件 (res) 是否具有與目前物件的屬性相符的屬性「Id」屬性。如果沒有,則初始化一個對象,將目前的「Id」作為屬性,並將「qty」屬性初始化為0,並將該物件推入結果陣列中。
  4. 求和:更新目前物件的「Id」對應的累加器物件的「qty」屬性加上目前物件的「qty」 value.
  5. 傳回結果:reduce() 方法傳回最終的累加器物件。該物件表示物件的分組和求和數組。

範例實作

以下jQuery 程式碼片段示範了上述步驟:

var array = [
  { Id: "001", qty: 1 },
  { Id: "002", qty: 2 },
  { Id: "001", qty: 2 },
  { Id: "003", qty: 4 }
];

var result = [];
array.reduce(function(res, value) {
  if (!res[value.Id]) {
    res[value.Id] = { Id: value.Id, qty: 0 };
    result.push(res[value.Id])
  }
  res[value.Id].qty += value.qty;
  return res;
}, {});

console.log(result);

此程式碼將輸出下列物件的分組和求和數組:

[
  { Id: "001", qty: 3 },
  { Id: "002", qty: 2 },
  { Id: "003", qty: 4 }
]

以上是如何在 jQuery 中使用 Reduce 方法對物件陣列進行分組和求和?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn