Comment puis-je convertir efficacement un tableau plat de données hiérarchiques en une structure arborescente imbriquée en JavaScript ?

Création de structures arborescentes à partir de données de tableau plat en JavaScript

Lorsque vous travaillez avec des données hiérarchiques complexes, il devient nécessaire de les organiser dans un arbre. comme structure d’analyse et de présentation. Dans ce cas, un fichier JSON ordonné contient les données, chaque entrée ayant un identifiant, un parentId, un niveau et un texte. La tâche consiste à convertir cette structure de données plate en une hiérarchie imbriquée.

Pour réaliser cette transformation efficacement, il est important de tirer parti d'une stratégie de recherche sur carte. Cela implique de créer une carte qui mappe chaque identifiant à son index dans la liste. En utilisant cette carte, la hiérarchie imbriquée peut être construite en un seul passage, éliminant ainsi le besoin de plusieurs boucles.

La fonction JavaScript suivante illustre l'approche de recherche de carte pour créer une structure arborescente :

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") {
      // if you have dangling branches check that map[node.parentId] exists
      list[map[node.parentId]].children.push(node);
    } else {
      roots.push(node);
    }
  }
  return roots;
}

En créant une carte pour accéder rapidement aux parents et en initialisant les listes d'enfants pour chaque nœud, la fonction peut fusionner efficacement les deux boucles for. Cette approche prend en charge plusieurs racines et peut gérer les branches pendantes ou les ignorer avec une simple modification.

Pour démontrer la fonctionnalité de la fonction, vous pouvez l'exécuter avec l'entrée suivante :

var entries = [{
    "id": "12",
    "parentId": "0",
    "text": "Man",
    "level": "1",
    "children": null
  },
  {
    "id": "6",
    "parentId": "12",
    "text": "Boy",
    "level": "2",
    "children": null
  },
  {
    "id": "7",
    "parentId": "12",
    "text": "Other",
    "level": "2",
    "children": null
  },
  {
    "id": "9",
    "parentId": "0",
    "text": "Woman",
    "level": "1",
    "children": null
  },
  {
    "id": "11",
    "parentId": "9",
    "text": "Girl",
    "level": "2",
    "children": null
  }
];

console.log(list_to_tree(entries));

Cela permettra afficher la structure arborescente hiérarchique avec les relations attendues entre les nœuds. En tirant parti de la stratégie de recherche sur carte, cette approche offre une solution efficace et flexible pour transformer des données hiérarchiques plates en tableaux arborescents bien structurés.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!