Skip to main content

Objectes i Orientació a Objectes

Els objectes són una de les estructures més potents de JavaScript. Permeten agrupar dades (propietats) i comportaments (mètodes) dins d’una mateixa entitat.

Creació i manipulació bàsica​

const persona = {
  nombre: "Juan",
  edad: 27,
  profesion: "Desarrollador",
};

Accés a propietats​

console.log(persona.nombre); // "Juan"
console.log(persona["edad"]); // 27

Modificació​

persona.edad = 31;

Afegeix propietats​

persona.pais = "Espanya";

Elimina propietats​

delete persona.profesion;

Object.keys / Object.values / Object.entries​

Object.keys(persona); // ["nombre", "edad", "pais"]
Object.values(persona); // ["Juan", 31, "Espanya"]
Object.entries(persona); // [["nombre", "Juan"], ["edad", 31], ["pais", "Espanya"]]

Activitats (Objectes)​

  1. Crear un objecte book amb title, author i year.
  2. Afegir propietat genero, eliminar year.
  3. Afegir mètode getDescription() que imprimeixi la descripció.
  4. Iterar sobre totes les propietats amb for...in.

Subobjectes​

const person = {
  name: "Juan",
  age: 28,
  address: {
    street: "123 Calle Principal",
    city: "Ciudad",
    country: "País",
  },
};

Accedir-hi​

console.log(person.address.city); // "Ciudad"

Modificar​

person.address.city = "Nova Ciutat";

Activitats (Subobjectes)​

  1. Crear subobjecte address amb street, city, country.
  2. Accedir i mostrar cada valor.
  3. Modificar valors.
  4. Afegir mètode getFullAddress() → "123 Calle Principal, Ciudad, País"
  5. Afegir contact amb phone i email, i mostrar-ho.

Orientació a Objectes​

Els objectes es poden definir amb classes a partir d'ES6:

class Persona {
  constructor(nombre, edad) {
    this.nombre = nombre;
    this.edad = edad;
  }

  presentar() {
    console.log(`Hola, sóc ${this.nombre} i tinc ${this.edad} anys.`);
  }
}
const persona = new Persona("Joan", 18);
persona.presentar();

Activitat amb classe​

  1. Crear classe Animal amb constructor name i mètode speak().
class Animal {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`${this.name} fa un soroll`);
  }
}

Getters i Setters​

Permeten controlar l’accés a propietats com si fossin valors directes:

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

  get nom() {
    return this._nom;
  }

  set nom(valor) {
    if (valor !== "") this._nom = valor;
  }
}

Activitats amb getters/setters​

  1. Crear getter/setter per nom amb validació.
  2. Getter/setter per edat: no pot ser negatiu.
  3. Intentar accedir a propietat privada amb # (ES2022).
class Persona {
  #edat;

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

  get edat() {
    return this.#edat;
  }

  set edat(valor) {
    if (valor > 0) this.#edat = valor;
  }
}

Objectes predefinits​

Date​

const avui = new Date();
console.log(avui.getFullYear());
console.log(avui.getDay()); // 0 (diumenge) - 6 (dissabte)

Math​

console.log(Math.random()); // nombre entre 0 i 1
console.log(Math.round(3.7)); // 4

Array​

const noms = ["Joan", "Esteve"];
noms.unshift("Jordi");
console.log(noms.length);

Aquest capítol et dona les bases de la programació orientada a objectes (OOP) en JavaScript, incloent gestió de dades complexes, encapsulació i creació de classes pròpies.