Heim >Web-Frontend >js-Tutorial >Wie kann man in JavaScript ein flaches JSON-Array effizient in eine hierarchische Baumstruktur umwandeln?

Wie kann man in JavaScript ein flaches JSON-Array effizient in eine hierarchische Baumstruktur umwandeln?

DDD
DDDOriginal
2024-12-14 18:42:11346Durchsuche

How to Efficiently Transform a Flat JSON Array into a Hierarchical Tree Structure in JavaScript?

Erstellen einer hierarchischen Baumdatenstruktur aus einem flachen JSON-Array in JavaScript

In Szenarien mit komplexen JSON-Daten ist es wichtig, diese hierarchisch zu organisieren. insbesondere zur Darstellung baumartiger Strukturen. In diesem Artikel geht es darum, wie man in JavaScript ein flaches JSON-Array in einen hierarchischen Baum umwandelt.

Problem

Gegeben sei ein flaches JSON-Array, das aus Objekten mit drei Schlüsseleigenschaften besteht:

  • id: Eindeutige Kennung für jeden Knoten
  • parentId: Kennung des übergeordneten Knotens (0 für Wurzelknoten)
  • Ebene: Tiefe des Knotens im Baum

Die Aufgabe besteht darin, dieses flache Array in eine hierarchische Baumstruktur umzuwandeln, in der jeder übergeordnete Knoten seine untergeordneten Knoten kapselt .

Lösung

Ein effizienter Ansatz nutzt einen Kartensuchalgorithmus, um Baue den Baum. Der Algorithmus durchläuft das flache Array zweimal:

  1. Initialisierung: Erstellen Sie eine Karte, in der die ID jedes Knotens seinem Index im Array zugeordnet ist. Initialisieren Sie untergeordnete Arrays für jeden Knoten.
  2. Baumkonstruktion: Durchlaufen Sie das Array erneut und ordnen Sie die parentId jedes Knotens dem entsprechenden übergeordneten Knoten zu. Wenn kein übergeordneter Knoten gefunden wird, wird der aktuelle Knoten zu einem Wurzelknoten.

Implementierung

Der folgende JavaScript-Codeausschnitt zeigt die Implementierung des Baums- Gebäudealgorithmus:

function list_to_tree(list) {
  var map = {}, node, roots = [], i;
  
  for (i = 0; i < list.length; i += 1) {
    map[list[i].id] = i; // initialize the map
    list[i].children = []; // initialize the children
  }
  
  for (i = 0; i < list.length; i += 1) {
    node = list[i];
    if (node.parentId !== "0") {
      // handle dangling branches here
      list[map[node.parentId]].children.push(node);
    } else {
      roots.push(node);
    }
  }
  return roots;
}

Verwendung

Zu Konvertieren Sie ein flaches JSON-Array in eine hierarchische Baumstruktur:

var entries = [
    // ... entries as in the provided example
];

var tree = list_to_tree(entries);

// The resulting `tree` is the hierarchical data structure

Fazit

Der in diesem Artikel vorgestellte Algorithmus wandelt flache JSON-Arrays effektiv in hierarchische Baumstrukturen in JavaScript um . Es basiert auf einem Kartensuchansatz für eine effiziente Konstruktion und eignet sich daher für die Verarbeitung komplexer Datensätze.

Das obige ist der detaillierte Inhalt vonWie kann man in JavaScript ein flaches JSON-Array effizient in eine hierarchische Baumstruktur umwandeln?. 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