JavaScript: destructuring, meno righe più chiarezza

Il destructuring estrae valori da oggetti e array assegnandoli a variabili in una sola riga.

const user = { name: "Ale", role: "dev", city: "Torino" };
const { name, role } = user;

const { theme = "light" } = {}; // default se manca
const { name: nome } = user;    // rinomina

const [first, second, ...rest] = [10, 20, 30, 40];
// first=10, second=20, rest=[30, 40]

function saluta({ name }) {     // direttamente nei parametri
  return "Ciao " + name;
}

Funziona con default, rinominazione e rest. È onnipresente in React (const { data } = useQuery()) e negli import.

Meno const x = obj.x ripetuti, più codice che dice subito quali dati ti servono. Piccola sintassi, grande pulizia.