TypeScript è passato da un esperimento di nicchia di Microsoft alla scelta predefinita per progetti JavaScript seri. Nell'indagine State of JS del 2024, oltre l'80% degli intervistati ha dichiarato di utilizzare TypeScript regolarmente. Framework importanti come Angular, Next.js e SvelteKit vengono distribuiti "TypeScript-first". Se scrivi JavaScript professionalmente, imparare TypeScript non è più un optional: è un'aspettativa.
Cos'è TypeScript?
TypeScript è un superset di JavaScript creato da Microsoft. Ogni file JavaScript valido è anche un file TypeScript valido. TypeScript aggiunge una funzionalità principale: un sistema di tipi statici che cattura gli errori in fase di compilazione anziché in fase di runtime. Il compilatore TypeScript (tsc) rimuove tutte le annotazioni di tipo e produce JavaScript puro che funziona ovunque: Node.js, browser, Deno o Bun.
Perché Esiste TypeScript?
JavaScript è stato progettato per piccoli script, pensati per aggiungere interattività alle pagine web. Man mano che le applicazioni sono cresciute fino a milioni di righe di codice (pensa a Gmail, VS Code, Figma), la tipizzazione dinamica di JavaScript è diventata un limite. Bug che un linguaggio a tipizzazione statica avrebbe individuato in fase di compilazione — accesso a proprietà su undefined, passaggio di argomenti con tipi errati, refusi nelle chiavi degli oggetti — emergevano solo in runtime, spesso in produzione.
TypeScript risolve questo problema fornendo a JavaScript un controllore di tipi in fase di compilazione. Scrivi ancora codice simile a JavaScript, ma il compilatore verifica la coerenza dei tuoi tipi prima che tu distribuisca il tuo lavoro.
TypeScript vs JavaScript: Differenze Chiave
function greet(name) {
return "Hello, " + name.toUpperCase();
}
greet(42); // Errore in runtime: name.toUpperCase is not a function
function greet(name: string): string {
return "Hello, " + name.toUpperCase();
}
greet(42); // ❌ Errore di compilazione: L'argomento del tipo 'number'
// non è assegnabile al parametro di tipo 'string'
Concetti Fondamentali di TypeScript
1. Annotazioni di Tipo
La funzionalità più basilare di TypeScript. Annotate variabili, parametri e tipi di ritorno con il loro tipo atteso.
let username: string = "Alice";
let age: number = 30;
let isAdmin: boolean = true;
let scores: number[] = [95, 87, 92];
function add(a: number, b: number): number {
return a + b;
}
2. Interfacce
Le interfacce definiscono la struttura degli oggetti. Sono una delle funzionalità più potenti di TypeScript per documentare e imporre contratti API.
interface User {
id: number;
name: string;
email: string;
role: "admin" | "editor" | "viewer";
lastLogin?: Date; // proprietà opzionale
}
function sendWelcome(user: User): void {
console.log(`Welcome, ${user.name}!`);
}
// ❌ Errore di compilazione se dimentichi una proprietà obbligatoria
sendWelcome({ id: 1, name: "Alice" }); // Manca 'email' e 'role'
3. Tipi Union e Tipi Letterali
I tipi union permettono a un valore di essere di uno tra diversi tipi. Combinati con i tipi letterali, creano definizioni di tipo precise e auto-documentanti.
type Status = "loading" | "success" | "error";
type ID = string | number;
function showStatus(status: Status): string {
switch (status) {
case "loading": return "⏳ Loading...";
case "success": return "✅ Done!";
case "error": return "❌ Failed";
}
}
4. Generics
I Generics consentono di scrivere codice riutilizzabile che funziona con qualsiasi tipo, preservando al contempo la sicurezza dei tipi.
function firstElement<T>(arr: T[]): T | undefined {
return arr[0];
}
const num = firstElement([1, 2, 3]); // tipo: number
const str = firstElement(["a", "b", "c"]); // tipo: string
Iniziare
# Installa TypeScript npm install -D typescript # Crea tsconfig.json npx tsc --init # Compila TypeScript in JavaScript npx tsc # Modalità di osservazione (ricompila al salvataggio) npx tsc --watch
Il file tsconfig.json controlla le opzioni del compilatore. Inizia con "strict": true: abilita l'intera suite di controlli sui tipi ed è considerata best practice per tutti i nuovi progetti.
Errori Comuni da Evitare
- Usare
anyovunque: Questo vanifica lo scopo di TypeScript. Se ti ritrovi a usareany, probabilmente hai bisogno di un'interfaccia o di un generic appropriato. - Ignorare gli errori del compilatore: Non usare
@ts-ignorecome abitudine. Correggi il problema di tipo sottostante. - Sovra-ingegnerizzare i tipi: Inizia in modo semplice. Non hai bisogno di tipi mappati avanzati o tipi condizionali per la maggior parte del codice applicativo.
- Non usare la modalità
strict: TypeScript non-strict rileva molti meno bug. Abilita sempre la modalità strict.
Quando Usare TypeScript
- Qualsiasi progetto con più di uno sviluppatore
- Librerie e pacchetti pubblicati su npm
- Codebase che si prevede vivranno più di 6 mesi
- Progetti che utilizzano framework che lo supportano nativamente (Next.js, Angular, SvelteKit)
Prova i Nostri Strumenti Gratuiti per Sviluppatori
Minifica, formatta e codifica il tuo codice istantaneamente nel tuo browser.