Introducció

La programació orientada a objectes (POO) és un paradigma de programació que utilitza "objectes" per representar dades i mètodes. JavaScript, tot i ser un llenguatge basat en prototips, permet la creació de classes i la implementació de POO a partir de l'ES6.

Conceptes Clau

  1. Classes

Una classe és una plantilla per crear objectes amb propietats i mètodes comuns.

  1. Objectes

Un objecte és una instància d'una classe. Conté dades (propietats) i funcions (mètodes).

  1. Constructors

El constructor és un mètode especial d'una classe que s'executa quan es crea una nova instància de la classe.

  1. Herència

La herència permet crear una nova classe basada en una classe existent, heretant-ne les propietats i mètodes.

  1. Encapsulació

L'encapsulació és la pràctica de mantenir les dades i els mètodes dins d'una classe, protegint-los de l'accés extern no autoritzat.

Creació de Classes en JavaScript

Definició d'una Classe

class Persona {
  constructor(nom, edat) {
    this.nom = nom;
    this.edat = edat;
  }

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

// Crear una instància de la classe Persona
const persona1 = new Persona('Joan', 30);
persona1.saludar(); // Hola, em dic Joan i tinc 30 anys.

Herència

class Empleat extends Persona {
  constructor(nom, edat, feina) {
    super(nom, edat); // Crida al constructor de la classe pare
    this.feina = feina;
  }

  treballar() {
    console.log(`${this.nom} està treballant com a ${this.feina}.`);
  }
}

// Crear una instància de la classe Empleat
const empleat1 = new Empleat('Anna', 28, 'Enginyera');
empleat1.saludar(); // Hola, em dic Anna i tinc 28 anys.
empleat1.treballar(); // Anna està treballant com a Enginyera.

Encapsulació

class Banc {
  constructor(saldo) {
    this._saldo = saldo; // Propietat privada
  }

  // Mètode públic per obtenir el saldo
  obtenirSaldo() {
    return this._saldo;
  }

  // Mètode públic per dipositar diners
  dipositar(diners) {
    if (diners > 0) {
      this._saldo += diners;
    }
  }

  // Mètode públic per retirar diners
  retirar(diners) {
    if (diners > 0 && diners <= this._saldo) {
      this._saldo -= diners;
    }
  }
}

// Crear una instància de la classe Banc
const compte = new Banc(1000);
compte.dipositar(500);
console.log(compte.obtenirSaldo()); // 1500
compte.retirar(200);
console.log(compte.obtenirSaldo()); // 1300

Exercicis Pràctics

Exercici 1: Crear una Classe

Crea una classe Cotxe amb les següents propietats: marca, model i any. Afegeix un mètode detalls que imprimeixi les propietats del cotxe.

class Cotxe {
  constructor(marca, model, any) {
    this.marca = marca;
    this.model = model;
    this.any = any;
  }

  detalls() {
    console.log(`Marca: ${this.marca}, Model: ${this.model}, Any: ${this.any}`);
  }
}

// Solució
const cotxe1 = new Cotxe('Toyota', 'Corolla', 2020);
cotxe1.detalls(); // Marca: Toyota, Model: Corolla, Any: 2020

Exercici 2: Herència

Crea una classe CotxeElectric que hereti de Cotxe i afegeix una propietat autonomia. Afegeix un mètode detallsComplets que imprimeixi totes les propietats, incloent l'autonomia.

class CotxeElectric extends Cotxe {
  constructor(marca, model, any, autonomia) {
    super(marca, model, any);
    this.autonomia = autonomia;
  }

  detallsComplets() {
    console.log(`Marca: ${this.marca}, Model: ${this.model}, Any: ${this.any}, Autonomia: ${this.autonomia} km`);
  }
}

// Solució
const cotxeElectric1 = new CotxeElectric('Tesla', 'Model S', 2021, 600);
cotxeElectric1.detallsComplets(); // Marca: Tesla, Model: Model S, Any: 2021, Autonomia: 600 km

Errors Comuns i Consells

  1. Oblidar el super en el constructor de la classe derivada: Quan es crea una classe que hereta d'una altra, és necessari cridar super al constructor de la classe derivada per inicialitzar les propietats de la classe pare.

    class Empleat extends Persona {
      constructor(nom, edat, feina) {
        // Oblidar super() resultarà en un error
        super(nom, edat);
        this.feina = feina;
      }
    }
    
  2. Accedir a propietats privades directament: Utilitza mètodes públics per accedir i modificar propietats privades.

    class Banc {
      constructor(saldo) {
        this._saldo = saldo;
      }
    
      obtenirSaldo() {
        return this._saldo;
      }
    }
    
    const compte = new Banc(1000);
    console.log(compte._saldo); // No és recomanable
    console.log(compte.obtenirSaldo()); // Recomanat
    

Conclusió

En aquesta secció, hem après els conceptes bàsics de la programació orientada a objectes en JavaScript, incloent la creació de classes, herència i encapsulació. Aquests conceptes són fonamentals per escriure codi més organitzat, reutilitzable i mantenible. A la propera secció, explorarem els mòduls i la importació/exportació de codi en JavaScript.

JavaScript: De Principiant a Avançat

Mòdul 1: Introducció a JavaScript

Mòdul 2: Estructures de Control

Mòdul 3: Funcions

Mòdul 4: Objectes i Arrays

Mòdul 5: Objectes i Funcions Avançades

Mòdul 6: El Model d'Objectes del Document (DOM)

Mòdul 7: APIs del Navegador i Temes Avançats

Mòdul 8: Proves i Depuració

Mòdul 9: Rendiment i Optimització

Mòdul 10: Frameworks i Llibreries de JavaScript

Mòdul 11: Projecte Final

© Copyright 2024. Tots els drets reservats