Introdução
Neste laboratório, exploraremos uma função JavaScript chamada nest que aninha recursivamente objetos ligados uns aos outros em um array plano. A função utiliza recursão, Array.prototype.filter() e Array.prototype.map() para filtrar e aninhar os itens com base em suas propriedades id e parent_id. Ao final deste laboratório, você terá uma melhor compreensão de como usar recursão para criar objetos aninhados em JavaScript.
Como Aninhar Objetos Usando Recursão em JavaScript
Para aninhar objetos em um array plano recursivamente, siga estes passos:
- Abra o Terminal/SSH e digite
nodepara começar a praticar a codificação. - Use recursão para aninhar objetos que estão ligados uns aos outros.
- Use
Array.prototype.filter()para filtrar os itens onde oidcorresponde aolink. - Use
Array.prototype.map()para mapear cada item para um novo objeto que possui uma propriedadechildrenque aninha recursivamente os itens com base em quais são filhos do item atual. - Omita o segundo argumento,
id, para usar o padrãonull, que indica que o objeto não está ligado a outro (ou seja, é um objeto de nível superior). - Omita o terceiro argumento,
link, para usar'parent_id'como a propriedade padrão que liga o objeto a outro por seuid.
Aqui está o código:
const nest = (items, id = null, link = "parent_id") =>
items
.filter((item) => item[link] === id)
.map((item) => ({ ...item, children: nest(items, item.id, link) }));
Para usar a função nest(), crie um array de objetos que tenham uma propriedade id e uma propriedade parent_id que os liga a outro objeto. Em seguida, chame a função nest() e passe o array como um argumento. A função retornará um novo array de objetos que são aninhados com base em sua propriedade parent_id.
Por exemplo:
const comments = [
{ id: 1, parent_id: null },
{ id: 2, parent_id: 1 },
{ id: 3, parent_id: 1 },
{ id: 4, parent_id: 2 },
{ id: 5, parent_id: 4 }
];
const nestedComments = nest(comments);
// [{ id: 1, parent_id: null, children: [...] }]
Resumo
Parabéns! Você concluiu o laboratório de Aninhamento de Objetos. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.