สมมติว่าเรามีอาร์เรย์ต่อไปนี้ใน JavaScript -
const arr =[{ "code":"2", "name":"PENDING"},{ "code":"2.2", "name":"PENDING CHILDREN"},{ "code":" 2.2.01.01", "name":"PENDING CHILDREN CHILDREN"},{ "code":"2.2.01.02", "name":"PENDING CHILDREN CHILDREN02"},{ "code":"1", "name" :"ACTIVE"},{ "code":"1.1", "name":"ACTIVE CHILDREN"},{ "code":"1.1.01", "name":"ACTIVE CHILDREN CHILDREN"}];
เราจำเป็นต้องเขียนฟังก์ชัน JavaScript ที่รับอาร์เรย์ดังกล่าว ฟังก์ชันควรสร้างโครงสร้างแบบต้นไม้จากอาร์เรย์นี้ตามคุณสมบัติ "ชื่อ" ของออบเจกต์
ดังนั้น สำหรับอาร์เรย์ด้านบน ผลลัพธ์ควรมีลักษณะดังนี้ −
const output =[{ "code":"2", "name":"PENDING", "children":[{ "code":"2.2", "name":"PENDING CHILDREN", "children" :[{ "code":"2.2.01.01", "name":"PENDING CHILDREN CHILDREN" }, { "code":"2.2.01.02", "name":"PENDING CHILDREN CHILDREN02" }] }]}, { "code":"1", "name":"ACTIVE", "children":[{ "code":"1.1", "name":"ACTIVE CHILDREN", "children":[{ "code":"1.1.01", "name":"ACTIVE CHILDREN CHILDREN" }] }]}]; ตัวอย่าง
รหัสสำหรับสิ่งนี้จะเป็น −
const arr =[{ "code":"2", "name":"PENDING"},{ "code":"2.2", "name":"PENDING CHILDREN"},{ "code":" 2.2.01.01", "name":"PENDING CHILDREN CHILDREN"},{ "code":"2.2.01.02", "name":"PENDING CHILDREN CHILDREN02"},{ "code":"1", "name" :"ACTIVE"},{ "code":"1.1", "name":"ACTIVE CHILDREN"},{ "code":"1.1.01", "name":"ACTIVE CHILDREN CHILDREN"}];const transformToTree =(arr, root ='') => { ให้ map ={}, สุดท้าย =[root], ระดับ =0; แผนที่[ราก] ={}; arr.forEach (el => { ให้ parent =root; while (ระดับ &&สุดท้าย [ระดับ].ความยาว>=el.code.length) { ระดับ --; }; parent =ล่าสุด [ระดับ]; ระดับ ++; last.length =ระดับ; last.push(el.code); map[el.code] =el; map[parent].children =map[parent].children || []; map[parent].children.push(el); }); ส่งคืน map[root].children;};console.log(JSON.stringify(transformToTree(arr), undefined, 4)); ผลลัพธ์
และผลลัพธ์ในคอนโซลจะเป็น −
[ { "code":"2", "name":"PENDING", "children":[ { "code":"2.2", "name":"PENDING CHILDREN", "children":[ { "code":"2.2.01.01", "name":"PENDING CHILDREN CHILDREN" }, { "code":"2.2.01.02", "name":"PENDING CHILDREN CHILDREN02" } ] } ] }, { "code ":"1", "name":"ACTIVE", "children":[ { "code":"1.1", "name":"ACTIVE CHILDREN", "children":[ { "code":"1.1. 01", "name":"ACTIVE CHILDREN CHILDREN" } ] } ] }]
