Desestruturação

Se você nunca usou atribuição via desestruturação até agora, sua vida mudará!

Destructuring assignment veio no ES6 e possibilita a extração de dados de arrays ou objetos literais em variáveis através da chave (array) ou propriedade (objeto).

Normalmente acessamos as propriedades de um objeto através de dot-notation:

const veiculo = {
  marca: 'Honda',
  cor: 'Prata',
  ano: '2017'
};
const marca = veiculo.marca;
const ano = veiculo.ano;

Conforme vamos utilizando esse formato acaba se tornando repetitivo e massante, então podemos partir para a atribuição via desestruturação:

const { marca, ano } = veiculo;

Casos que necessite acessar propriedades de objetos aninhados:

const contato = {
 nome: 'Allan',
 sobrenome: 'Barbosa',
 links: {
  social: {
   twitter: 'https://twitter.com/allbarbos',
   linkedin: 'https://www.linkedin.com/in/allbarbos'   
  }
 }
}
const { twitter, linkedin } = contato.links.social

No caso em que seja necessário alterar o nome da variável, basta declarar dois pontos e o nome desejado:

const { twitter: tw, linkedin: lk } = contato.links.social

Podemos ainda definir um valor padrão caso não encontre uma propriedade dentro do objeto:

const { idade = 18 } = contato

Como não existe a idade dentro do objeto contato, retornará 18, caso contrário seria undefined.

Array

A desestruturação funciona também com array, exemplo:

const array = ['Honda', 'Prata', 2017];
const [marca, cor, ano] = array;
console.log(marca); // "Honda" 
console.log(cor); // "Prata"
console.log(ano; // 2017

Isso é o basicão que podemos fazer com desestruturação, a mesma possui outras usabilidades mais complexas que podem ser visualizadas na documentação.