Reduce メソッドを使用して jQuery でオブジェクトの配列をグループ化して合計するにはどうすればよいですか?

jQuery でのオブジェクトの配列のグループ化と合計: 詳細ガイド

オブジェクトの配列内の値のグループ化と合計は一般的なタスクですプログラミングで。 jQuery では、reduce() メソッドを使用してこれを効率的に実現できます。

目標を理解する

目的は、特定のプロパティに基づいてオブジェクトの配列をグループ化することです。 、この場合は「Id」プロパティです。オブジェクトがグループ化されたら、各グループの数量 (「数量」) を合計する必要があります。

段階的な解決策

1. 初期化: グループ化された結果を保存するために、result という名前の空の配列を作成します。 object.

2. 配列のループ: 配列を反復処理するには、reduce() メソッドを使用します。このメソッドはパラメータとして 2 つの関数を取ります:

   • アキュムレータ関数: 前の反復の結果を累積します。通常、res または acc として表されます。
   • value function: 配列内の現在の要素を処理します。通常、value または currentValue として表されます。
3. Grouping: Reduce() メソッド内で、アキュムレータ オブジェクト (res) に現在のオブジェクトのプロパティと一致するプロパティがあるかどうかを確認します。 「ID」プロパティ。そうでない場合は、現在の "Id" をプロパティとして使用し、"qty" プロパティを 0 に初期化してオブジェクトを初期化し、このオブジェクトを結果の配列にプッシュします。
4. 合計:現在のオブジェクトの「qty」を追加することで、現在のオブジェクトの「Id」に対応するアキュムレータ オブジェクトの「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 }
]

以上がReduce メソッドを使用して jQuery でオブジェクトの配列をグループ化して合計するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。