El Projecte | Sobre nosaltres | Contribuir | Donacions | Llicència
HOME Els meus cursos Finalitzats
◄ Anterior
◄

Genèrics

Següent ►
►

Els genèrics són una característica poderosa de TypeScript que permet crear components reutilitzables que poden treballar amb diferents tipus de dades. Els genèrics proporcionen una manera de definir funcions, classes i interfícies que no estan lligades a un tipus específic, sinó que poden treballar amb qualsevol tipus que es passi com a argument.

Conceptes Clau

  1. Definició de Genèrics: Els genèrics es defineixen utilitzant paràmetres de tipus, que són variables de tipus que es poden utilitzar dins de la funció, classe o interfície.
  2. Paràmetres de Tipus: Els paràmetres de tipus es defineixen entre els símbols < i >.
  3. Reutilització de Codi: Els genèrics permeten escriure codi més flexible i reutilitzable.

Exemples Pràctics

Funcions Genèriques

Una funció genèrica és una funció que pot treballar amb diferents tipus de dades. Aquí teniu un exemple d'una funció genèrica que retorna el mateix valor que rep com a argument:

function identity<T>(arg: T): T {
    return arg;
}

// Ús de la funció genèrica amb diferents tipus
let output1 = identity<string>("Hola, TypeScript!");
let output2 = identity<number>(42);

console.log(output1); // Hola, TypeScript!
console.log(output2); // 42

Classes Genèriques

Les classes genèriques permeten crear estructures de dades que poden treballar amb diferents tipus. Aquí teniu un exemple d'una classe genèrica que emmagatzema un valor:

class Box<T> {
    private content: T;

    constructor(content: T) {
        this.content = content;
    }

    getContent(): T {
        return this.content;
    }
}

// Ús de la classe genèrica amb diferents tipus
let stringBox = new Box<string>("Hola, món!");
let numberBox = new Box<number>(123);

console.log(stringBox.getContent()); // Hola, món!
console.log(numberBox.getContent()); // 123

Interfícies Genèriques

Les interfícies genèriques permeten definir contractes que poden treballar amb diferents tipus. Aquí teniu un exemple d'una interfície genèrica:

interface Pair<T, U> {
    first: T;
    second: U;
}

let pair: Pair<string, number> = {
    first: "Hola",
    second: 42
};

console.log(pair.first); // Hola
console.log(pair.second); // 42

Exercicis Pràctics

Exercici 1: Funció Genèrica

Crea una funció genèrica reverseArray que prengui un array de qualsevol tipus i retorni un nou array amb els elements en ordre invers.

function reverseArray<T>(arr: T[]): T[] {
    return arr.reverse();
}

// Prova la funció amb diferents tipus
let reversedStringArray = reverseArray<string>(["a", "b", "c"]);
let reversedNumberArray = reverseArray<number>([1, 2, 3]);

console.log(reversedStringArray); // ["c", "b", "a"]
console.log(reversedNumberArray); // [3, 2, 1]

Exercici 2: Classe Genèrica

Crea una classe genèrica Stack que implementi una pila (stack) amb operacions per afegir (push) i treure (pop) elements.

class Stack<T> {
    private items: T[] = [];

    push(item: T): void {
        this.items.push(item);
    }

    pop(): T | undefined {
        return this.items.pop();
    }

    peek(): T | undefined {
        return this.items[this.items.length - 1];
    }

    isEmpty(): boolean {
        return this.items.length === 0;
    }
}

// Prova la classe amb diferents tipus
let numberStack = new Stack<number>();
numberStack.push(1);
numberStack.push(2);
console.log(numberStack.pop()); // 2
console.log(numberStack.peek()); // 1

let stringStack = new Stack<string>();
stringStack.push("a");
stringStack.push("b");
console.log(stringStack.pop()); // "b"
console.log(stringStack.peek()); // "a"

Errors Comuns i Consells

  1. Oblidar especificar el tipus: Quan es crida una funció genèrica o es crea una instància d'una classe genèrica, és important especificar el tipus. Si no es fa, TypeScript intentarà inferir el tipus, però això pot no ser sempre correcte.
  2. No utilitzar genèrics quan caldria: Els genèrics són molt útils per crear codi reutilitzable. Si trobes que estàs duplicant codi per treballar amb diferents tipus, considera utilitzar genèrics.

Conclusió

Els genèrics són una eina poderosa en TypeScript que permeten crear codi flexible i reutilitzable. Hem vist com utilitzar genèrics en funcions, classes i interfícies, i hem practicat amb alguns exercicis. Amb aquesta base, estàs preparat per explorar altres característiques avançades de TypeScript.

◄ Anterior
◄
Següent ►
►
El Projecte | Sobre nosaltres | Contribuir | Donacions | Llicència
© Copyright 2024. Tots els drets reservats