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 principal
  • endereco é um objeto aninhado dentro de pessoa

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 é:

  1. pega o objeto pessoa
  2. dentro dele, pega endereco
  3. dentro de endereco, pega cidade

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.