Bagaimana untuk Membina Struktur Pokok Hierarki dengan Cekap daripada Susunan Rata dalam JavaScript?

Membina Struktur Pokok Hierarki daripada Tatasusunan Rata dalam JavaScript

Pengenalan

Dalam JavaScript, bekerja dengan data hierarki ialah penting untuk pelbagai aplikasi, seperti mencipta struktur pokok atau menu navigasi. Apabila data disimpan dalam tatasusunan rata, ia menjadi perlu untuk mengubahnya menjadi struktur hierarki untuk memudahkan manipulasi dan visualisasi data. Artikel ini akan menunjukkan kaedah yang berkesan untuk membina tatasusunan pokok daripada tatasusunan rata dalam JavaScript.

Masalah

Memandangkan fail JSON kompleks yang terdiri daripada objek dengan sifat berikut :

• id: Pengecam unik
• parentId: ID nod induk (0 untuk nod akar)
• tahap: Kedalaman nod dalam pepohon

Tugasnya ialah untuk menukar struktur JSON rata kepada struktur pokok hierarki dengan objek bersarang mewakili induk -hubungan kanak-kanak.

Penyelesaian

Penyelesaian memanfaatkan pendekatan carian peta untuk membina struktur pokok hierarki dengan cekap. Algoritma melibatkan dua langkah:

1. Buat Peta untuk Mengindeks Objek:

   • Lelaran melalui tatasusunan rata dan cipta peta di mana kunci adalah sifat id dan nilai adalah tatasusunan yang sepadan indeks.

2. Bina Struktur Pokok:

   • Lelaran melalui tatasusunan rata sekali lagi:

     • Untuk setiap objek, dapatkan semula indeks induknya daripada peta menggunakan parentId.
     • Jika induk wujud (bukan akar), tambahkan objek semasa sebagai anak kepada induknya.
     • Jika induk itu tidak wujud, ia adalah nod akar dan harus ditambah ke nod akar tatasusunan.

Contoh

Pertimbangkan tatasusunan JSON rata berikut:

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

Menggunakan algoritma di atas pada tatasusunan rata ini akan mengeluarkan pepohon hierarki berikut struktur:

const result = [
{
  "id": "12",
  "parentId": "0",
  "text": "Man",
  "level": "1",
  "children": [
    {
      "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":
  {
    "id": "11",
    "parentId": "9",
    "text": "Girl",
    "level": "2",
    "children": null
  }
}
];

Kesimpulan

Algoritma yang dibentangkan menyediakan cara yang cekap untuk menukar tatasusunan rata data hierarki kepada tatasusunan pokok berstruktur dalam JavaScript. Pendekatan ini memanfaatkan carian peta untuk mengoptimumkan proses dan menyokong berbilang nod akar. Ia sesuai untuk situasi di mana anda perlu mencipta struktur pokok daripada data kompleks untuk manipulasi atau visualisasi selanjutnya.

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