สร้าง child keys จาก parent keys ในอาร์เรย์ JavaScript

สมมติว่าเรามีอาร์เรย์ของอ็อบเจกต์แบบนี้:

const arr = [
  { id: 1, parent_id: 0, title: 'Movies' },
  { id: 2, parent_id: 0, title: 'Music' },
  { id: 3, parent_id: 1, title: 'Russian movies' },
  { id: 4, parent_id: 2, title: 'Russian music' },
  { id: 5, parent_id: 3, title: 'New' },
  { id: 6, parent_id: 3, title: 'Top10' },
  { id: 7, parent_id: 4, title: 'New' },
  { id: 8, parent_id: 4, title: 'Top10' },
  { id: 9, parent_id: 0, title: 'Soft' }
];

เราต้องเขียนฟังก์ชันที่รับอาร์เรย์นี้และคืนค่าอาร์เรย์ใหม่ของอ็อบเจกต์ที่แต่ละอ็อบเจกต์มี property เพิ่มเติม "child" ซึ่งต้องเป็นอาร์เรย์ของ id ทั้งหมดของอ็อบเจกต์ที่เป็นลูกโดยตรงหรือโดยอ้อมของอ็อบเจกต์นั้น

ดังนั้น ผลลัพธ์ควรดูแบบนี้:

[
  { id: 1, parent_id: 0, title: 'Movies', childs: [3, 5, 6] },
  { id: 2, parent_id: 0, title: 'Music', childs: [4, 7, 8] },
  { id: 3, parent_id: 1, title: 'Russian movies', childs: [5, 6] },
  { id: 4, parent_id: 2, title: 'Russian music', childs: [7, 8] },
  { id: 5, parent_id: 3, title: 'New', childs: [] },
  { id: 6, parent_id: 3, title: 'Top10', childs: [] },
  { id: 7, parent_id: 4, title: 'New', childs: [] },
  { id: 8, parent_id: 4, title: 'Top10', childs: [] },
  { id: 9, parent_id: 0, title: 'Soft', childs: [] }
]

ตอนนี้มาเขียนโค้ดสำหรับฟังก์ชันนี้กัน:

ตัวอย่างโค้ด

const arr = [
  { id: 1, parent_id: 0, title: 'Movies' },
  { id: 2, parent_id: 0, title: 'Music' },
  { id: 3, parent_id: 1, title: 'Russian movies' },
  { id: 4, parent_id: 2, title: 'Russian music' },
  { id: 5, parent_id: 3, title: 'New' },
  { id: 6, parent_id: 3, title: 'Top10' },
  { id: 7, parent_id: 4, title: 'New' },
  { id: 8, parent_id: 4, title: 'Top10' },
  { id: 9, parent_id: 0, title: 'Soft' }
];

const generateChild = arr => {
  return arr.reduce((acc, val, ind, array) => {
    const childs = [];
    array.forEach((el, i) => {
      if (childs.includes(el.parent_id) || el.parent_id === val.id) {
        childs.push(el.id);
      }
    });
    return acc.concat({...val, childs});
  }, []);
};

console.log(generateChild(arr));

ผลลัพธ์

ผลลัพธ์ในคอนโซลจะเป็นดังนี้:

[
  { id: 1, parent_id: 0, title: 'Movies', childs: [3, 5, 6] },
  { id: 2, parent_id: 0, title: 'Music', childs: [4, 7, 8] },
  { id: 3, parent_id: 1, title: 'Russian movies', childs: [5, 6] },
  { id: 4, parent_id: 2, title: 'Russian music', childs: [7, 8] },
  { id: 5, parent_id: 3, title: 'New', childs: [] },
  { id: 6, parent_id: 3, title: 'Top10', childs: [] },
  { id: 7, parent_id: 4, title: 'New', childs: [] },
  { id: 8, parent_id: 4, title: 'Top10', childs: [] },
  { id: 9, parent_id: 0, title: 'Soft', childs: [] }
]