JavaScript オブジェクト配列で重複キーをマージし、それらの値を合計するにはどうすればよいですか?

Linda Hamilton
リリース: 2024-11-28 03:47:10
オリジナル
812 人が閲覧しました

How to Merge Duplicate Keys and Sum Their Values in a JavaScript Object Array?

オブジェクト配列内の重複キーのマージと値の合計

JavaScript では、オブジェクトの配列を操作することが一般的です。場合によっては、特定のプロパティを維持しながら、配列内のオブジェクトをグループ化して変更する必要が生じることがあります。このようなシナリオの 1 つは、類似のキーに関連付けられた値を合計することです。

オブジェクトの配列例を使用してこのタスクを検討してみましょう:

const objects = [
  { name: 'P1', value: 150 },
  { name: 'P1', value: 150 },
  { name: 'P2', value: 200 },
  { name: 'P3', value: 450 },
];
ログイン後にコピー

私たちの目標は、オブジェクトを「name」プロパティでグループ化することです。そして、個別の「名前」ごとに「値」プロパティを合計します。目的の出力は次のようになります。

[
  { 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 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート