El Projecte | Sobre nosaltres | Contribuir | Donacions | Llicència

HOME

Les classes són una característica fonamental en TypeScript que permeten crear objectes amb propietats i mètodes. Les classes proporcionen una manera de definir estructures de dades complexes i encapsular la lògica relacionada amb aquestes dades. En aquest tema, aprendrem com crear i utilitzar classes en TypeScript.

Definició de Classes

Una classe en TypeScript es defineix utilitzant la paraula clau class seguida del nom de la classe. Aquí teniu un exemple bàsic:

class Persona {
    nom: string;
    edat: number;

    constructor(nom: string, edat: number) {
        this.nom = nom;
        this.edat = edat;
    }

    saludar() {
        console.log(`Hola, em dic ${this.nom} i tinc ${this.edat} anys.`);
    }
}

const persona1 = new Persona('Joan', 30);
persona1.saludar(); // Hola, em dic Joan i tinc 30 anys.

Explicació

Definició de la Classe: La classe Persona té dues propietats (nom i edat) i un mètode (saludar).
Constructor: El constructor és un mètode especial que s'executa quan es crea una nova instància de la classe. En aquest cas, inicialitza les propietats nom i edat.
Mètode: El mètode saludar imprimeix un missatge a la consola.

Constructors

El constructor és un mètode especial que s'utilitza per inicialitzar els objectes creats amb una classe. Aquí teniu un exemple més detallat:

class Cotxe {
    marca: string;
    model: string;
    any: number;

    constructor(marca: string, model: string, any: number) {
        this.marca = marca;
        this.model = model;
        this.any = any;
    }

    descripcio() {
        return `${this.marca} ${this.model} de l'any ${this.any}`;
    }
}

const cotxe1 = new Cotxe('Toyota', 'Corolla', 2020);
console.log(cotxe1.descripcio()); // Toyota Corolla de l'any 2020

Explicació

Propietats: marca, model i any són propietats de la classe Cotxe.
Constructor: Inicialitza les propietats amb els valors proporcionats quan es crea una nova instància de Cotxe.
Mètode: descripcio retorna una cadena que descriu el cotxe.

Propietats i Mètodes

Les propietats són variables que pertanyen a una classe, mentre que els mètodes són funcions que pertanyen a una classe. Aquí teniu un exemple amb més propietats i mètodes:

class Rectangle {
    amplada: number;
    alçada: number;

    constructor(amplada: number, alçada: number) {
        this.amplada = amplada;
        this.alçada = alçada;
    }

    area() {
        return this.amplada * this.alçada;
    }

    perimetre() {
        return 2 * (this.amplada + this.alçada);
    }
}

const rectangle1 = new Rectangle(5, 10);
console.log(`Àrea: ${rectangle1.area()}`); // Àrea: 50
console.log(`Perímetre: ${rectangle1.perimetre()}`); // Perímetre: 30

Explicació

Propietats: amplada i alçada són propietats de la classe Rectangle.
Mètodes: area i perimetre són mètodes que calculen l'àrea i el perímetre del rectangle, respectivament.

Herència

L'herència permet crear una nova classe que hereta les propietats i mètodes d'una altra classe. Aquí teniu un exemple:

class Animal {
    nom: string;

    constructor(nom: string) {
        this.nom = nom;
    }

    ferSoroll() {
        console.log(`${this.nom} fa un soroll.`);
    }
}

class Gos extends Animal {
    constructor(nom: string) {
        super(nom);
    }

    ferSoroll() {
        console.log(`${this.nom} borda.`);
    }
}

const gos1 = new Gos('Rex');
gos1.ferSoroll(); // Rex borda.

Explicació

Classe Base: Animal és la classe base amb una propietat nom i un mètode ferSoroll.
Classe Derivada: Gos és una classe derivada que hereta de Animal i sobreescriu el mètode ferSoroll.

Modificadors d'Accés

Els modificadors d'accés controlen la visibilitat de les propietats i mètodes d'una classe. Els principals modificadors són public, private i protected.

Public

Les propietats i mètodes public són accessibles des de qualsevol lloc.

class Persona {
    public nom: string;

    constructor(nom: string) {
        this.nom = nom;
    }
}

const persona1 = new Persona('Joan');
console.log(persona1.nom); // Joan

Private

Les propietats i mètodes private només són accessibles dins de la classe on es defineixen.

class Banc {
    private saldo: number;

    constructor(saldo: number) {
        this.saldo = saldo;
    }

    mostrarSaldo() {
        console.log(`El saldo és ${this.saldo} euros.`);
    }
}

const compte = new Banc(1000);
compte.mostrarSaldo(); // El saldo és 1000 euros.
// console.log(compte.saldo); // Error: Property 'saldo' is private and only accessible within class 'Banc'.

Protected

Les propietats i mètodes protected són accessibles dins de la classe on es defineixen i en les classes derivades.

class Empleat {
    protected salari: number;

    constructor(salari: number) {
        this.salari = salari;
    }
}

class Manager extends Empleat {
    mostrarSalari() {
        console.log(`El salari és ${this.salari} euros.`);
    }
}

const manager = new Manager(5000);
manager.mostrarSalari(); // El salari és 5000 euros.

Classes Abstractes

Les classes abstractes no es poden instanciar directament i sovint contenen mètodes abstractes que han de ser implementats per les classes derivades.

abstract class Figura {
    abstract area(): number;

    descripcio() {
        console.log('Aquesta és una figura.');
    }
}

class Cercle extends Figura {
    radi: number;

    constructor(radi: number) {
        super();
        this.radi = radi;
    }

    area() {
        return Math.PI * this.radi * this.radi;
    }
}

const cercle = new Cercle(5);
console.log(`Àrea del cercle: ${cercle.area()}`); // Àrea del cercle: 78.53981633974483
cercle.descripcio(); // Aquesta és una figura.

Explicació

Classe Abstracta: Figura és una classe abstracta amb un mètode abstracte area i un mètode concret descripcio.
Classe Derivada: Cercle és una classe derivada que implementa el mètode area.

Exercicis Pràctics

Exercici 1

Crea una classe Llibre amb les propietats titol, autor i anyPublicacio. Afegeix un mètode descripcio que retorni una cadena amb la descripció del llibre.

class Llibre {
    titol: string;
    autor: string;
    anyPublicacio: number;

    constructor(titol: string, autor: string, anyPublicacio: number) {
        this.titol = titol;
        this.autor = autor;
        this.anyPublicacio = anyPublicacio;
    }

    descripcio() {
        return `${this.titol} escrit per ${this.autor} l'any ${this.anyPublicacio}`;
    }
}

const llibre1 = new Llibre('El Quixot', 'Miguel de Cervantes', 1605);
console.log(llibre1.descripcio()); // El Quixot escrit per Miguel de Cervantes l'any 1605

Exercici 2

Crea una classe CompteBancari amb les propietats numeroCompte i saldo. Afegeix mètodes per depositar i retirar diners, i un mètode mostrarSaldo que imprimeixi el saldo actual.

class CompteBancari {
    numeroCompte: string;
    saldo: number;

    constructor(numeroCompte: string, saldo: number) {
        this.numeroCompte = numeroCompte;
        this.saldo = saldo;
    }

    depositar(import: number) {
        this.saldo += import;
    }

    retirar(import: number) {
        if (import <= this.saldo) {
            this.saldo -= import;
        } else {
            console.log('Saldo insuficient.');
        }
    }

    mostrarSaldo() {
        console.log(`El saldo del compte ${this.numeroCompte} és ${this.saldo} euros.`);
    }
}

const compte1 = new CompteBancari('123456789', 500);
compte1.depositar(200);
compte1.mostrarSaldo(); // El saldo del compte 123456789 és 700 euros.
compte1.retirar(100);
compte1.mostrarSaldo(); // El saldo del compte 123456789 és 600 euros.
compte1.retirar(700); // Saldo insuficient.

Conclusió

En aquesta secció, hem après com crear i utilitzar classes en TypeScript. Hem vist com definir propietats i mètodes, utilitzar constructors, aplicar herència, i utilitzar modificadors d'accés. També hem explorat les classes abstractes i hem practicat amb alguns exercicis. Amb aquests coneixements, estàs preparat per crear estructures de dades més complexes i organitzar millor el teu codi en TypeScript.

Classes

Continguts

Definició de Classes

Explicació

Constructors

Explicació

Propietats i Mètodes

Explicació

Herència

Explicació

Modificadors d'Accés

Public

Private

Protected

Classes Abstractes

Explicació

Exercicis Pràctics

Exercici 1

Exercici 2

Conclusió

Curs de TypeScript

Mòdul 1: Introducció a TypeScript

Mòdul 2: Treballant amb Tipus

Mòdul 3: Tipus Avançats

Mòdul 4: Funcions i Mòduls

Mòdul 5: Programació Asíncrona

Mòdul 6: Eines i Millors Pràctiques

Mòdul 7: Temes Avançats