Heim >Web-Frontend >js-Tutorial >Wie gruppiere ich Array-Elemente nach einer gemeinsamen Eigenschaft in JavaScript?

Wie gruppiere ich Array-Elemente nach einer gemeinsamen Eigenschaft in JavaScript?

Susan Sarandon
Susan SarandonOriginal
2024-12-18 19:50:11981Durchsuche

How to Group Array Items by a Common Property in JavaScript?

Array-Elemente mithilfe eines Objekts gruppieren

Beim Umgang mit Arrays, die Objekte enthalten, kann es nützlich sein, Elemente basierend auf einer gemeinsamen Eigenschaft zu gruppieren. Dies kann erreicht werden, indem eine Zuordnung von Gruppennamen zu zugehörigen Werten erstellt wird.

Angenommen, Sie haben ein Array wie das folgende:

myArray = [
  {group: "one", color: "red"},
  {group: "two", color: "blue"},
  {group: "one", color: "green"},
  {group: "one", color: "black"}
]

Sie möchten es in ein neues Array mit Elementen konvertieren werden nach der Eigenschaft „Gruppe“ gruppiert:

myArray = [
  {group: "one", color: ["red", "green", "black"]},
  {group: "two", color: ["blue"]}
]

Um dies zu erreichen, können Sie Folgendes verwenden Schritte:

  1. Erstellen Sie ein Zuordnungsobjekt, das jeden „Gruppen“-Eigenschaftswert einem leeren Array zuordnet.
  2. Iterieren Sie über jedes Element im ursprünglichen Array und:
    a. Rufen Sie den Eigenschaftswert „Gruppe“ ab.
    b. Wenn das Zuordnungsobjekt einen Schlüssel für den Eigenschaftswert „Gruppe“ enthält, verschieben Sie den Eigenschaftswert „Farbe“ in das zugehörige Array. Andernfalls fügen Sie dem Zuordnungsobjekt einen neuen Schlüssel mit einem Wert eines leeren Arrays hinzu und verschieben Sie den Eigenschaftswert „Farbe“ in dieses Array.
  3. Zuletzt transformieren Sie das Zuordnungsobjekt in das gewünschte Format, wobei die Schlüssel die sind „Gruppen“-Eigenschaftswerte und Werte sind Objekte mit „Gruppen“- und „Farb“-Eigenschaften.

Hier ist eine Beispiel-JavaScript-Implementierung:

var myArray = [
    {group: "one", color: "red"},
    {group: "two", color: "blue"},
    {group: "one", color: "green"},
    {group: "one", color: "black"}
];

var group_to_values = myArray.reduce(function (obj, item) {
    obj[item.group] = obj[item.group] || [];
    obj[item.group].push(item.color);
    return obj;
}, {});

var groups = Object.keys(group_to_values).map(function (key) {
    return {group: key, color: group_to_values[key]};
});

Upon Bei der Ausführung erzeugt dieser Code das gewünschte gruppierte Array:

groups:

{
  "one": [
    "red",
    "green",
    "black"
  ],
  "two": [
    "blue"
  ]
}

Das obige ist der detaillierte Inhalt vonWie gruppiere ich Array-Elemente nach einer gemeinsamen Eigenschaft in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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