Con l'introduzione di ECMAScript 6 (ES6), noto anche come ECMAScript 2015, gli sviluppatori hanno a disposizione una suite ampliata di potenti funzionalità che rendono lo scripting lato client e server più efficiente e piacevole. In questo articolo, esploreremo le caratteristiche salienti di ES6, fornendo esempi di codice che riflettono le best practices del 2024.
Dichiarazioni let
e const
ES6 introduce let
e const
per una gestione più flessibile e sicura delle variabili.
let name = 'theArtCode';
const PI = 3.14;
let
consente di dichiarare variabili limitate all'ambito del blocco, a differenza di var
, che definisce variabili con ambito globale o funzionale. const
è simile a let
, ma viene utilizzato per la dichiarazione di costanti immutabili.
Template Strings
Le Template Strings offrono una sintassi più semplice per l'incorporazione di espressioni e variabili all'interno di stringhe grazie all'ultizzo delle "backticks".
let name = 'theArtCode';
console.log(`Benvenuto in ${name}.`);
Arrow Functions
Le arrow functions in JavaScript consentono di scrivere funzioni con una sintassi ridotta e preservano il valore di this dal loro contesto di definizione, semplificando la gestione del contesto in callback e funzioni annidate.
const somma = (a, b) => a + b;
console.log(somma(5, 3)); // Output: 8
Destructuring
Il destructuring consente un'assegnazione più diretta da array e oggetti
const [first, second] = [10, 20];
console.log(first); // Output: 10
const {name, year} = {name: 'Luca', year: 30};
console.log(year); // Output: 30
Moduli
ES6 standardizza i moduli, consentendo un'organizzazione migliore del codice
// library.js
export const somma = (a, b) => a + b;
// app.js
import { somma } from './library.js';
console.log(somma(2, 3)); // Output: 5
Promise e Async/Await
Le Promise e Async/Await semplificano la gestione delle operazioni asincrone
const fetchData = () => {
return new Promise(resolve => setTimeout(() => resolve("Dati"), 2000));
}
const fetchAsync = async () => {
let data = await fetchData();
console.log(data); // Output: Dati
};
fetchAsync();
Classi
Le classi in ES6 offrono una sintassi più chiara per creare oggetti e gestire l'ereditarietà.
class Person {
constructor(name) {
this.name = name;
}
sayHello() {
console.log(`Hello, I'm ${this.name}`);
}
}
const theArtCode = new Person('theArtCode');
theArtCode.sayHello(); // Output: Hello, I'm theArtCode