Le nuove caratteristiche di ES6

ES6 (ECMAScript 2015) è il nome della sesta edizione dello standard implementato da JavaScript. L’ES6 ha portato una serie di nuovi costrutti e funzionalità alla lingua, offrendo agli sviluppatori una serie di strumenti potenti per migliorare la qualità, l’efficienza e la leggibilità del loro codice.

Vediamo le caratteristiche più interessanti.

Scope a livello di blocco con let e const
Uno dei problemi di JavaScript prima di ES6 era l’assenza di un vero scope a livello di blocco.
Con l’introduzione di let e const, ora possiamo dichiarare variabili all’interno di blocchi specifici,
limitando la loro visibilità al solo blocco in cui sono definite.
Inoltre, const ci permette di dichiarare costanti immutabili, fornendo una maggiore sicurezza e chiarezza nel nostro codice.

Arrow Functions
Le arrow functions offrono una sintassi più concisa per la dichiarazione di funzioni.
Invece di scrivere function, possiamo utilizzare l’operatore => per definire funzioni anonime.
Queste funzioni sono particolarmente utili quando si lavora con funzioni callback o quando si desidera mantenere il contesto di this all’interno di una funzione.

odds  = evens.map(v => v + 1)
pairs = evens.map(v => ({ even: v, odd: v + 1 }))
nums  = evens.map((v, i) => v + i)

Template Literals
Grazie ai template literals, possiamo finalmente dire addio alla concatenazione di stringhe confusionaria.
Con i template literals, possiamo creare stringhe multilinea e inserire espressioni all’interno utilizzando la sintassi ${espressione}.
Questa funzionalità rende la generazione di stringhe dinamiche molto più leggibile ed elegante.

var customer = { name: "Foo" }
var card = { amount: 7, product: "Bar", unitprice: 42 }
var message = `Hello ${customer.name},
want to buy ${card.amount} ${card.product} for
a total of ${card.amount * card.unitprice} bucks?`

Destructuring
Il destructuring ci consente di estrarre valori da array o oggetti in variabili distinte con una sintassi molto più compatta.
Possiamo dichiarare e assegnare variabili contemporaneamente, evitando ripetizioni inutili e semplificando la manipolazione dei dati complessi.

var list = [ 1, 2, 3 ]
var [ a, , b ] = list
[ b, a ] = [ a, b ]

var { f, m, c} = getFamily()

function f ([ name, val ]) {
    console.log(name, val)
}
function g ({ name: n, val: v }) {
    console.log(n, v)
}
function h ({ name, val }) {
    console.log(name, val)
}
f([ "bar", 42 ])
g({ name: "foo", val:  7 })
h({ name: "bar", val: 42 })

Parametri di default
Spesso, nella programmazione, dobbiamo gestire valori di default per i parametri delle funzioni.
ES6 ci offre un modo semplice per dichiarare valori predefiniti per i parametri delle funzioni, evitando trucchetti come l’operatore ternario o le condizioni di fallback.

function f (x, y = 7, z = 42) {
    return x + y + z
}
f(1) === 50

Rest e Spread Operator
Il rest e lo spread operator sono strumenti potenti per manipolare array e oggetti.
Con il rest operator (…), possiamo raccogliere un numero variabile di argomenti in un array all’interno di una funzione.
D’altra parte, lo spread operator ci consente di espandere un array o un oggetto in punti di inserimento, semplificando l’aggiunta di elementi a un array o la creazione di nuovi oggetti basati su quelli esistenti.

function f (x, y, ...a) {
    return (x + y) * a.length
}
f(1, 2, "hello", true, 7) === 9

var params = [ "hello", true, 7 ]
var other = [ 1, 2, ...params ] // [ 1, 2, "hello", true, 7 ]

Per un elenco completo delle nuove feature, consulta il sito:

http://es6-features.org/