Desestruturação — JavaScript moderno (ES6+)

Desestruturação (destructuring)

A desestruturação permite "desempacotar" valores de arrays e objetos em variáveis independentes de forma concisa.

const coordenadas = [10, 20];
const [x, y] = coordenadas;
console.log(x, y); // 10 20

Eles são atribuídos por posição. Você pode pular elementos com vírgulas:

const [primeiro, , terceiro] = ["a", "b", "c"];
console.log(primeiro, terceiro); // "a" "c"

Aqui eles são atribuídos por nome de propriedade:

const pessoa = { nome: "Ana", idade: 30 };
const { nome, idade } = pessoa;
console.log(nome, idade); // "Ana" 30

const { nome: n, pais = "Brasil" } = pessoa;
console.log(n);    // "Ana"
console.log(pais); // "Brasil" (não existia, usa o valor padrão)

A desestruturação é muito comum ao receber parâmetros em funções:

function saudar({ nome }) {
  return "Olá, " + nome;
}
saudar({ nome: "Luis" }); // "Olá, Luis"

Trocar variáveis com desestruturação

let a = 1;
let b = 2;
[a, b] = [b, a]; // truque moderno para trocar
console.log(a, b); // 2 1