Heim Web-Frontend Front-End-Fragen und Antworten Eingehende Analyse der Gruppensummenoperation von JavaScript

Eingehende Analyse der Gruppensummenoperation von JavaScript

Apr 06, 2023 am 09:05 AM

Javascript ist eine leistungsstarke Programmiersprache mit zahlreichen Datenverarbeitungs- und Berechnungsfunktionen. Unter diesen ist die Gruppensummierung eine wichtige Funktion, die uns bei der detaillierten Analyse und Verarbeitung komplexer Daten helfen kann.

Wir können die Array-Methode in Javascript verwenden, um Gruppensummenoperationen durchzuführen. Beispielsweise haben wir ein Array, das mehrere Datensätze enthält. Jeder Datensatz enthält einen Namen und einen entsprechenden Wert. Jetzt wollen wir diese Daten nach Namen gruppieren und den Gesamtwert jeder Gruppe berechnen.

Zunächst können wir die Daten mit der Reduce-Methode in Javascript gruppieren. Die Reduzierungsmethode kann das Array durchlaufen und einen Akkumulator verwenden, um die Gruppierung der Daten aufzuzeichnen. Als nächstes können wir ein leeres Objekt definieren, um die gruppierten Daten zu speichern:

const data = [
  { name: "Group A", value: 10 },
  { name: "Group B", value: 15 },
  { name: "Group A", value: 20 },
  { name: "Group B", value: 25 },
  { name: "Group C", value: 30 },
];

const groupedData = data.reduce((acc, cur) => {
  if (!acc[cur.name]) {
    acc[cur.name] = [];
  }
  acc[cur.name].push(cur.value);
  return acc;
}, {});
Nach dem Login kopieren

Nachdem wir den obigen Code ausgeführt haben, erhalten wir ein Objekt, das die gruppierten Daten enthält:

{
  "Group A": [10, 20],
  "Group B": [15, 25],
  "Group C": [30]
}
Nach dem Login kopieren

Als nächstes können wir mit der Map-Methode in Javascript eine Summenberechnung für gruppierte Daten durchführen Daten. Die Map-Methode kann das Array durchlaufen und die angegebene Operation für jedes Element ausführen. Hier summieren wir jedes gruppierte Datenarray und speichern das Ergebnis in einem neuen Array:

const summedGroups = Object.keys(groupedData).map((groupName) => {
  const groupValues = groupedData[groupName];
  const sum = groupValues.reduce((acc, cur) => acc + cur);
  return { name: groupName, value: sum };
});
Nach dem Login kopieren

Nach der Ausführung des obigen Codes erhalten wir ein Array mit den gruppierten summierten Daten:

[
  { name: "Group A", value: 30 },
  { name: "Group B", value: 40 },
  { name: "Group C", value: 30 }
]
Nach dem Login kopieren

Schließlich können wir die Ergebnisse ausgeben oder verwenden auf andere Weise. Der vollständige Code lautet wie folgt:

const data = [
  { name: "Group A", value: 10 },
  { name: "Group B", value: 15 },
  { name: "Group A", value: 20 },
  { name: "Group B", value: 25 },
  { name: "Group C", value: 30 },
];

const groupedData = data.reduce((acc, cur) => {
  if (!acc[cur.name]) {
    acc[cur.name] = [];
  }
  acc[cur.name].push(cur.value);
  return acc;
}, {});

const summedGroups = Object.keys(groupedData).map((groupName) => {
  const groupValues = groupedData[groupName];
  const sum = groupValues.reduce((acc, cur) => acc + cur);
  return { name: groupName, value: sum };
});

console.log(summedGroups);
Nach dem Login kopieren

Mit dem obigen Code können wir problemlos Gruppensummenoperationen für Arrays in Javascript durchführen und so eine effizientere Datenverarbeitung und Berechnung erzielen.

Das obige ist der detaillierte Inhalt vonEingehende Analyse der Gruppensummenoperation von JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße Artikel -Tags

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Erklären Sie das Konzept des faulen Ladens. Erklären Sie das Konzept des faulen Ladens. Mar 13, 2025 pm 07:47 PM

Erklären Sie das Konzept des faulen Ladens.

Was ist Useffizität? Wie verwenden Sie es, um Nebenwirkungen auszuführen? Was ist Useffizität? Wie verwenden Sie es, um Nebenwirkungen auszuführen? Mar 19, 2025 pm 03:58 PM

Was ist Useffizität? Wie verwenden Sie es, um Nebenwirkungen auszuführen?

Wie funktioniert das Currying in JavaScript und wie hoch sind ihre Vorteile? Wie funktioniert das Currying in JavaScript und wie hoch sind ihre Vorteile? Mar 18, 2025 pm 01:45 PM

Wie funktioniert das Currying in JavaScript und wie hoch sind ihre Vorteile?

Wie funktioniert der React -Versöhnungsalgorithmus? Wie funktioniert der React -Versöhnungsalgorithmus? Mar 18, 2025 pm 01:58 PM

Wie funktioniert der React -Versöhnungsalgorithmus?

Was sind Funktionen höherer Ordnung in JavaScript und wie können sie verwendet werden, um prägnanter und wiederverwendbarer Code zu schreiben? Was sind Funktionen höherer Ordnung in JavaScript und wie können sie verwendet werden, um prägnanter und wiederverwendbarer Code zu schreiben? Mar 18, 2025 pm 01:44 PM

Was sind Funktionen höherer Ordnung in JavaScript und wie können sie verwendet werden, um prägnanter und wiederverwendbarer Code zu schreiben?

Wie verhindern Sie das Standardverhalten bei Ereignishandlern? Wie verhindern Sie das Standardverhalten bei Ereignishandlern? Mar 19, 2025 pm 04:10 PM

Wie verhindern Sie das Standardverhalten bei Ereignishandlern?

Was sind die Vor- und Nachteile kontrollierter und unkontrollierter Komponenten? Was sind die Vor- und Nachteile kontrollierter und unkontrollierter Komponenten? Mar 19, 2025 pm 04:16 PM

Was sind die Vor- und Nachteile kontrollierter und unkontrollierter Komponenten?

Was ist usecontext? Wie verwenden Sie es, um den Zustand zwischen Komponenten zu teilen? Was ist usecontext? Wie verwenden Sie es, um den Zustand zwischen Komponenten zu teilen? Mar 19, 2025 pm 03:59 PM

Was ist usecontext? Wie verwenden Sie es, um den Zustand zwischen Komponenten zu teilen?

See all articles