Il destructuring

Javascript ES6 e destructuring

dalla versione ES6 Javascript mette a disposizione un costrutto molto interessante quando vogliamo accedere alle proprietà di un oggetto e copiarne il contenuto all’interno di altre variabili, una per ogni proprietà.

Se consideriamo ad esempio il seguente oggetto

const libro = {
    titolo: "La Divina Commedia",
    autore: "Dante Alighieri",
    casa_editrice: "PincoPallo"
}

volendo craere due variabili che contengano i valori delle proprietà titolo e autore per l’oggetto contenuto nella variabile libro dovrei scrivere

const titolo = libro.titolo 
const autore = libro.autore

come puoi notare stiamo duplicando parecchio codice, immagina solo a voler fare la stessa operazione con un oggetto più complesso, dovremmo scrivere decine di righe quasi uguali, con alta probabilità di errore.

il costrutto del destructuring di un oggetto ci consente di effettuare la stessa operazione in modo più compatto.

const { titolo, autore } = libro

questa riga è equivalente alle due scritte sopra. Leggendola stiamo chiedendo di dichiarare due variabili titolo e autore a cui assegnare i valori delle medesime proprietà dell’oggetto libro.

Facendo destructuring possiamo anche dare alle variabili che creiamo un nome diverso rispetto alle proprietà dell’oggetto da cui le leggiamo, come succede in questo spezzone di codice

const { titolo, autore: scrittore } = libro

in questo caso stiamo chiedendo che la variabile da creare contenente il valore della proprietà autore dell’oggetto libro si chiami scrittore.