Les guàrdies de tipus (type guards) són una característica poderosa de TypeScript que permeten verificar el tipus d'una variable en temps d'execució. Això és especialment útil quan es treballa amb tipus d'unió, ja que permet assegurar-se que una variable compleix amb un determinat tipus abans de realitzar operacions específiques d'aquest tipus.
Conceptes Clau
- Tipus d'Unió: Permeten que una variable pugui tenir més d'un tipus.
- Guàrdies de Tipus: Verifiquen el tipus d'una variable en temps d'execució.
- Operadors
typeof
iinstanceof
: Eines comunes per implementar guàrdies de tipus.
Tipus d'Unió
Abans d'entrar en les guàrdies de tipus, és important entendre els tipus d'unió. Un tipus d'unió permet que una variable pugui tenir més d'un tipus.
Guàrdies de Tipus amb typeof
L'operador typeof
és una manera senzilla de verificar el tipus primitiu d'una variable.
function imprimirValor(valor: string | number) { if (typeof valor === "string") { console.log(`El valor és una cadena: ${valor}`); } else { console.log(`El valor és un número: ${valor}`); } } imprimirValor("Hola"); imprimirValor(42);
Explicació del Codi
- Funció
imprimirValor
: Accepta un paràmetre que pot ser una cadena (string
) o un número (number
). - Guàrdia de Tipus
typeof
: Verifica si el tipus devalor
és una cadena. Si és així, imprimeix un missatge específic per a cadenes. Si no, assumeix que és un número i imprimeix un missatge per a números.
Guàrdies de Tipus amb instanceof
L'operador instanceof
és útil per verificar si un objecte és una instància d'una classe específica.
class Gato { maullar() { console.log("Miau!"); } } class Gos { bordar() { console.log("Guau!"); } } function ferSoroll(animal: Gato | Gos) { if (animal instanceof Gato) { animal.maullar(); } else { animal.bordar(); } } const gat = new Gato(); const gos = new Gos(); ferSoroll(gat); ferSoroll(gos);
Explicació del Codi
- Classes
Gato
iGos
: Defineixen dos tipus d'animals amb mètodes específics (maullar
ibordar
). - Funció
ferSoroll
: Accepta un paràmetre que pot ser unGato
o unGos
. - Guàrdia de Tipus
instanceof
: Verifica sianimal
és una instància deGato
. Si és així, crida el mètodemaullar
. Si no, assumeix que és unGos
i crida el mètodebordar
.
Guàrdies de Tipus Personalitzades
També es poden crear funcions de guàrdia de tipus personalitzades per a tipus més complexos.
interface Peix { nedar(): void; } interface Ocell { volar(): void; } function ésPeix(animal: Peix | Ocell): animal is Peix { return (animal as Peix).nedar !== undefined; } function moure(animal: Peix | Ocell) { if (ésPeix(animal)) { animal.nedar(); } else { animal.volar(); } } const peix: Peix = { nedar: () => console.log("El peix neda") }; const ocell: Ocell = { volar: () => console.log("L'ocell vola") }; moure(peix); moure(ocell);
Explicació del Codi
- Interfícies
Peix
iOcell
: Defineixen dos tipus d'animals amb mètodes específics (nedar
ivolar
). - Funció
ésPeix
: És una guàrdia de tipus personalitzada que verifica si un animal és unPeix
. - Funció
moure
: Accepta un paràmetre que pot ser unPeix
o unOcell
. - Guàrdia de Tipus Personalitzada: Utilitza la funció
ésPeix
per verificar sianimal
és unPeix
. Si és així, crida el mètodenedar
. Si no, assumeix que és unOcell
i crida el mètodevolar
.
Exercicis Pràctics
Exercici 1
Escriu una funció que accepti un paràmetre que pot ser un string
o un number
. Si és un string
, retorna la seva longitud. Si és un number
, retorna el seu doble.
Solució
function processarValor(valor: string | number): number { if (typeof valor === "string") { return valor.length; } else { return valor * 2; } } console.log(processarValor("Hola")); // 4 console.log(processarValor(21)); // 42
Exercici 2
Crea una funció que accepti un paràmetre que pot ser un Gato
o un Gos
(utilitza les classes de l'exemple anterior). La funció ha de retornar un missatge diferent depenent del tipus d'animal.
Solució
function descriureAnimal(animal: Gato | Gos): string { if (animal instanceof Gato) { return "Aquest és un gat."; } else { return "Aquest és un gos."; } } console.log(descriureAnimal(new Gato())); // Aquest és un gat. console.log(descriureAnimal(new Gos())); // Aquest és un gos.
Resum
Les guàrdies de tipus són una eina essencial en TypeScript per treballar amb tipus d'unió i assegurar-se que les operacions es realitzen de manera segura. Utilitzant operadors com typeof
i instanceof
, així com guàrdies de tipus personalitzades, es pot verificar el tipus d'una variable en temps d'execució i evitar errors comuns. Practicar amb aquests conceptes ajudarà a millorar la seguretat i la robustesa del teu codi TypeScript.
Curs de TypeScript
Mòdul 1: Introducció a TypeScript
- Què és TypeScript?
- Configuració de l'entorn de TypeScript
- Tipus bàsics
- Anotacions de tipus
- Compilació de TypeScript
Mòdul 2: Treballant amb Tipus
Mòdul 3: Tipus Avançats
Mòdul 4: Funcions i Mòduls
- Tipus de Funció
- Paràmetres Opcional i per Defecte
- Paràmetres Rest
- Mòduls i Espais de Noms
- Decoradors
Mòdul 5: Programació Asíncrona
Mòdul 6: Eines i Millors Pràctiques
- Linting i Formatació
- Proves de Codi TypeScript
- TypeScript amb Webpack
- TypeScript amb React
- Millors Pràctiques