Lezioni del modulo (1/2)
Type alias vs Interfacce
In TypeScript, possiamo definire la struttura di oggetti complessi in due modi principali: usando le Interfacce (interface) o gli Alias di Tipo (type). Entrambi servono a descrivere la "forma" di un oggetto o di una struttura dati, ma hanno alcune differenze fondamentali.
Le Interfacce (interface)
Un'interfaccia definisce un contratto per la struttura di un oggetto. È lo strumento standard per descrivere la forma di oggetti e API in modo estensibile.
interface Book {
title: string;
pages: number;
author?: string; // Proprietà opzionale (può essere omessa)
}
const myBook: Book = {
title: 'Il Signore degli Anelli',
pages: 1200,
};Il punto interrogativo (?) contrassegna una proprietà come opzionale. L'oggetto myBook è valido anche se omette la proprietà author.
Gli Alias di Tipo (type)
Un alias di tipo permette di associare un nuovo nome a qualsiasi tipo esistente, inclusi tipi primitivi, unioni, tuple o intere strutture di oggetti.
type Point = {
x: number;
y: number;
};
const coordinates: Point = { x: 10, y: 20 };Differenze Chiave: Estensione e Declaration Merging
Sebbene interface e type siano intercambiabili per la maggior parte dei casi d'uso ordinari, presentano due differenze cruciali:
1. Estensibilità (Inheritance)
Le interfacce si estendono con la parola chiave extends:
interface User {
username: string;
}
interface Admin extends User {
privileges: string[];
}Gli alias di tipo non possono essere estesi con extends, ma possono essere combinati usando l'intersezione (&):
type User = {
username: string;
};
type Admin = User & {
privileges: string[];
};2. Declaration Merging (Unione delle Dichiarazioni)
Più interfacce con lo stesso nome nello stesso scope vengono unite automaticamente dal compilatore:
interface User {
name: string;
}
interface User {
email: string;
}
// Ora User ha sia 'name' che 'email'!Questo comportamento non è supportato dai type alias: dichiarare due volte lo stesso type causerà un errore di compilazione.
Prova tu
Esercizio 1: Interfaccia Utente
Definisci un'interfaccia chiamata User che descrive un oggetto utente. L'interfaccia deve contenere: id come numero, username come stringa, ed email come stringa opzionale.
Mostra suggerimento
Usa la sintassi email?: string per contrassegnarla come opzionale.
Soluzione disponibile dopo 3 tentativi
Esercizio 2: Type Alias Point2D
Crea un type alias chiamato Point2D che rappresenta un punto bidimensionale con le coordinate x e y (entrambi numeri).
Mostra suggerimento
Usa la sintassi type Point2D = { x: number; y: number; };
Soluzione disponibile dopo 3 tentativi
Esercizio 3: Estensione di Interfacce
Definisci un'interfaccia chiamata Product con id (numero) e price (numero). Successivamente, definisci un'interfaccia chiamata DiscountedProduct che estende Product e aggiunge una proprietà opzionale chiamata discountCode (stringa).
Mostra suggerimento
Usa extends Product per ereditare i campi, e aggiungi discountCode?: string.
Soluzione disponibile dopo 3 tentativi
Esercizio 4: Configurazione Server
Definisci un type alias chiamato ServerConfig che rappresenta un oggetto di configurazione per un server. Deve contenere: host (stringa), port (numero), e useHttps come campo booleano opzionale.
Mostra suggerimento
Usa la sintassi type ServerConfig = { host: string; port: number; useHttps?: boolean; }.
Soluzione disponibile dopo 3 tentativi