Skip to content

Desestruturação de Objetos

A desestruturação de objetos permite que você extraia propriedades de um objeto e as atribua a variáveis utilizando uma sintaxe de atribuição que espelha a estrutura do objeto.

Exemplo Básico

Aqui está um exemplo básico de desestruturação de objetos:

javascript
const pessoa = {
  nome: "João",
  idade: 30,
  profissao: "Desenvolvedor",
};

// Desestruturação
const { nome, idade, profissao } = pessoa;

console.log(nome); // João
console.log(idade); // 30
console.log(profissao); // Desenvolvedor

Neste exemplo, as variáveis nome, idade e profissao são criadas e atribuídas aos valores correspondentes das propriedades do objeto pessoa.

Atribuição a Variáveis com Nomes Diferentes

Você pode também desestruturar um objeto e atribuir as propriedades a variáveis com nomes diferentes:

javascript
const pessoa = {
  nome: "João",
  idade: 30,
  profissao: "Desenvolvedor",
};

// Desestruturação com renomeação
const { nome: nomeCompleto, idade: anos, profissao: trabalho } = pessoa;

console.log(nomeCompleto); // João
console.log(anos); // 30
console.log(trabalho); // Desenvolvedor

Aqui, as propriedades nome, idade e profissao são desestruturadas e atribuídas às variáveis nomeCompleto, anos e trabalho, respectivamente.

Valores Padrão

A desestruturação também permite definir valores padrão para variáveis caso a propriedade correspondente do objeto não esteja definida:

javascript
const pessoa = {
  nome: "João",
  idade: 30,
};

// Desestruturação com valores padrão
const { nome, idade, profissao = "Desconhecido" } = pessoa;

console.log(nome); // João
console.log(idade); // 30
console.log(profissao); // Desconhecido

No exemplo acima, profissao não está definida no objeto pessoa, então o valor padrão 'Desconhecido' é atribuído à variável profissao.

Desestruturação Aninhada

Você pode desestruturar objetos aninhados utilizando uma sintaxe similar:

javascript
const pessoa = {
  nome: "João",
  idade: 30,
  endereco: {
    rua: "Rua A",
    cidade: "Cidade B",
  },
};

// Desestruturação aninhada
const {
  nome,
  endereco: { rua, cidade },
} = pessoa;

console.log(nome); // João
console.log(rua); // Rua A
console.log(cidade); // Cidade B

Neste caso, as propriedades rua e cidade do objeto endereco são desestruturadas diretamente.

Benefícios da Desestruturação

  1. Sintaxe Concisa e Legível: Reduz a necessidade de código repetitivo ao acessar propriedades de objetos.
  2. Atribuição de Variáveis Simples: Facilita a extração e a renomeação de propriedades de objetos.
  3. Valores Padrão: Permite definir valores padrão para variáveis, evitando o uso de verificações explícitas.

A desestruturação é uma ferramenta poderosa para tornar o código JavaScript mais limpo e legível, especialmente quando lidamos com estruturas de dados complexas.