Parliamo

project-cherry.dev

Avanzato20 min

Intro a TypeScript

Primi passi con TypeScript: tipi base, interfacce e generics per scrivere JavaScript più sicuro.

Intro a TypeScript

TypeScript è un superset di JavaScript che aggiunge i tipi statici. Il codice TypeScript viene compilato in JavaScript normale, ma durante lo sviluppo il compilatore cattura errori che altrimenti scopriresti solo a runtime.

Tipi base

javascript
// TypeScript
let nome: string = "Marco";
let eta: number = 30;
let attivo: boolean = true;
let tags: string[] = ["dev", "frontend"];

Interfacce

Definisci la forma di un oggetto:

javascript
interface Utente {
  id: number;
  nome: string;
  email: string;
  ruolo?: string; // opzionale
}

function saluta(utente: Utente): string {
  return \`Ciao, \${utente.nome}!\`;
}

Type e Union

javascript
type Stato = "attivo" | "sospeso" | "eliminato";
type ID = string | number;

function cercaUtente(id: ID): Utente | null {
  // ...
}

Generics

Scrivi funzioni e tipi riutilizzabili che funzionano con qualsiasi tipo:

javascript
function primo<T>(array: T[]): T | undefined {
  return array[0];
}

primo<string>(["a", "b", "c"]); // "a"
primo<number>([1, 2, 3]);       // 1

Esempio pratico: API tipizzata

javascript
interface RispostaAPI<T> {
  dati: T;
  successo: boolean;
  errore?: string;
}

async function chiamaAPI<T>(url: string): Promise<RispostaAPI<T>> {
  const risposta = await fetch(url);
  const dati = await risposta.json();
  return { dati, successo: risposta.ok };
}

const risultato = await chiamaAPI<Utente[]>("/api/utenti");

TypeScript è ormai lo standard nei progetti professionali. Framework come Next.js, Angular e la maggior parte delle librerie moderne sono scritti in TypeScript.