Objetos aninhados: objetos dentro de objetos
Entenda como organizar dados que possuem sub-informações, criando estruturas mais complexas.
Agora você vai aprender um conceito muito comum no JavaScript: objetos aninhados.
"Aninhado" significa "dentro de outro".
Em termos simples: é quando uma propriedade de um objeto guarda outro objeto.
Pensando no dia a dia
Imagine o cadastro de uma pessoa:
- nome
- idade
- endereço
O endereço, por si só, já tem várias informações:
- rua
- número
- cidade
- estado
Em vez de deixar tudo no mesmo nível, podemos colocar o endereço como um objeto dentro do objeto pessoa.
Isso deixa os dados mais organizados e mais próximos da vida real.
Exemplo básico
const pessoa = {
nome: "Lia",
idade: 28,
endereco: {
rua: "Rua das Flores",
numero: 150,
cidade: "Recife",
estado: "PE"
}
};
Aqui:
pessoaé o objeto principalenderecoé um objeto aninhado dentro depessoa
Acessando propriedades em objetos aninhados
Você acessa em cadeia, como se estivesse abrindo pastas:
console.log(pessoa.nome); // Lia
console.log(pessoa.endereco.cidade); // Recife
console.log(pessoa.endereco.estado); // PE
A leitura de pessoa.endereco.cidade é:
- pega o objeto
pessoa - dentro dele, pega
endereco - dentro de
endereco, pegacidade
Atualizando valores aninhados
Também dá para atualizar normalmente:
pessoa.endereco.numero = 200;
pessoa.endereco.cidade = "Olinda";
console.log(pessoa.endereco.numero); // 200
console.log(pessoa.endereco.cidade); // Olinda
Adicionando novas propriedades dentro do objeto interno
pessoa.endereco.cep = "50000-000";
console.log(pessoa.endereco.cep); // 50000-000
Removendo propriedades aninhadas
delete pessoa.endereco.rua;
console.log(pessoa.endereco);
// { numero: 200, cidade: "Olinda", estado: "PE", cep: "50000-000" }
Cuidado com propriedades que podem não existir
Se você tentar acessar um caminho que não existe, pode dar erro.
Exemplo perigoso:
const usuario = { nome: "Ana" };
// console.log(usuario.endereco.cidade); // erro
Nesse caso, usuario.endereco não existe.
Uma forma segura é validar antes:
if (usuario.endereco) {
console.log(usuario.endereco.cidade);
}
Ou usar encadeamento opcional:
console.log(usuario.endereco?.cidade); // undefined (sem quebrar o código)
Quando usar objetos aninhados?
Use quando os dados têm "subgrupos" naturais, como:
- usuário -> endereço
- pedido -> cliente
- empresa -> departamento
- produto -> dimensões
Isso ajuda muito na organização e na manutenção do código.
Resumo da lição
- Objetos aninhados são objetos dentro de objetos.
- Eles ajudam a organizar dados mais complexos.
- O acesso é feito em cadeia:
objeto.interno.propriedade. - Você pode acessar, alterar, adicionar e remover propriedades internas.
- Em acessos profundos, vale validar existência ou usar
?.para evitar erros.