Bagaimana dengan Cekap Menukar Susunan Rata Objek JSON ke dalam Struktur Pokok Hierarki dalam JavaScript?

Menukar Tatasusunan Rata kepada Struktur Pokok Hierarki dalam JavaScript

Dalam JavaScript, kita sering menghadapi situasi di mana kita perlu menyusun data secara hierarki. Satu perwakilan biasa ialah struktur pokok, di mana nod saling berkaitan dengan hubungan ibu bapa-anak. Artikel ini meneroka teknik yang cekap untuk menukar tatasusunan rata objek JSON kepada struktur pokok hierarki sedemikian.

Penerangan Masalah

Memandangkan tatasusunan objek JSON, setiap satu mewakili nod dalam pepohon, dengan sifat seperti "id," "parentId," "level," dan "teks," kami menyasarkan untuk menukar tatasusunan rata ini menjadi objek JSON bersarang di mana setiap nod mengandungi tatasusunan anak-anaknya.

Penyelesaian

Satu pendekatan berkesan melibatkan penggunaan algoritma carian peta. Dengan mencipta peta yang mengaitkan "id" setiap nod dengan indeks yang sepadan dalam tatasusunan, kami boleh melintasi tatasusunan dengan cekap dan membina struktur hierarki.

Pertama sekali, kami memulakan peta dan memastikan setiap nod mempunyai tatasusunan "kanak-kanak" kosong untuk menyimpan keturunannya. Kemudian, kami mengulangi tatasusunan dan untuk setiap nod, kami menyemak "parentId"nya. Jika ia bukan "0", kami mencari nod induk menggunakan "id"nya daripada peta dan menambahkan nod semasa sebagai kanak-kanak. Nod dengan "parentId" sebagai "0" mewakili akar pokok.

Kelebihan utama penyelesaian ini ialah kecekapannya dan keupayaannya untuk mengendalikan berbilang akar. Ia tidak bergantung pada perpustakaan luaran dan boleh mengendalikan cawangan berjuntai (nod anak tanpa ibu bapa).

Berikut ialah coretan kod JavaScript yang melaksanakan penyelesaian ini:

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;
}

Menggunakan input sampel yang disediakan , fungsi akan menjana output hierarki yang dijangkakan, seperti yang ditunjukkan dalam contoh di bawah:

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));

Ini pendekatan menyediakan penyelesaian yang mudah dan cekap untuk membina struktur pokok hierarki daripada tatasusunan rata, memenuhi keperluan pengurusan data dan keperluan visualisasi anda.

Atas ialah kandungan terperinci Bagaimana dengan Cekap Menukar Susunan Rata Objek JSON ke dalam Struktur Pokok Hierarki dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!