Menu
Coddy logo textTech

Costruire oggetti

Fa parte della sezione Programmazione orientata agli oggetti del percorso JavaScript di Coddy. Lezione 49 di 56.

Ora che abbiamo compreso i problemi dell'ereditarietà profonda e della relazione «ha un», impariamo a costruire oggetti combinando componenti piccoli e riutilizzabili. Questo approccio ci offre la massima flessibilità! 

Lo schema di base:

// Passaggio 1: crea componenti piccoli e mirati
class Engine {
  constructor(power) {
    this.power = power;
  }
  
  start() {
    console.log(`Engine (${this.power}HP) starting...`);
  }
}

class Wheels {
  constructor(count) {
    this.count = count;
  }
  
  rotate() {
    console.log(`${this.count} wheels rotating`);
  }
}
// Passaggio 2: costruisci oggetti combinando componenti
class Car {
  constructor(brand, enginePower, wheelCount) {
    this.brand = brand;
    this.engine = new Engine(enginePower);    // HA UN motore
    this.wheels = new Wheels(wheelCount);     // HA ruote
  }
  
  drive() {
    console.log(`${this.brand} is driving:`);
    this.engine.start();
    this.wheels.rotate();
  }
}
// Passaggio 3: usa l'oggetto composto
const myCar = new Car('Toyota', 150, 4);
myCar.drive();
// Output:
// Toyota sta guidando:
// Motore (150HP) in avviamento...
// 4 ruote in rotazione

Il vero potere: combina i componenti come preferisci:

// Componenti più specializzati
class TurboCharger {
  boost() {
    console.log('Turbo engaged! Extra power!');
  }
}

class SoundSystem {
  constructor(type) {
    this.type = type;
  }
  
  playMusic() {
    console.log(`Playing music on ${this.type} sound system`);
  }
}
// Costruisci auto diverse con combinazioni diverse
class SportsCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(300);
    this.wheels = new Wheels(4);
    this.turbo = new TurboCharger();      // L'auto sportiva ha il turbo
    this.soundSystem = new SoundSystem('Premium'); // E un buon impianto audio
  }
  
  raceMode() {
    console.log(`${this.brand} in race mode:`);
    this.engine.start();
    this.turbo.boost();
    this.wheels.rotate();
    console.log('VROOOOM!');
  }
  
  cruise() {
    console.log(`${this.brand} cruising:`);
    this.engine.start();
    this.wheels.rotate();
    this.soundSystem.playMusic();
  }
}
class EconomyCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(100);
    this.wheels = new Wheels(4);
    // Niente turbo per l'auto economica
    this.soundSystem = new SoundSystem('Basic'); // Solo impianto audio di base
  }
  
  drive() {
    console.log(`${this.brand} driving efficiently:`);
    this.engine.start();
    this.wheels.rotate();
    this.soundSystem.playMusic();
  }
}
// Guarda quanto è flessibile!
const ferrari = new SportsCar('Ferrari');
const honda = new EconomyCar('Honda');

ferrari.raceMode();  // Ha il turbo!
ferrari.cruise();    // Ha un impianto audio di alta qualità!

honda.drive();       // Solo funzionalità di base

Questo approccio ti offre la flessibilità di combinare i comportamenti senza complesse catene di ereditarietà!

challenge icon

Sfida

Completa i metodi di SmartBulb nel file SmartBulb.js.

  1. Implementa il metodo activate() per accendere la luce.
  2. Implementa il metodo adjustBrightness() per impostare la luminosità e registrare esattamente: Brightness set to ${this.brightness.level}%

Provalo tu

import { SmartBulb } from './SmartBulb.js';

const bedroomLight = new SmartBulb('warm white');

console.log('1. Activating light:');
bedroomLight.activate();

console.log('\n2. Adjusting brightness:');
bedroomLight.adjustBrightness(75);
quiz iconMettiti alla prova

Questa lezione include un breve quiz. Inizia la lezione per rispondere e tenere traccia dei tuoi progressi.

Tutte le lezioni di Programmazione orientata agli oggetti

Esercitati da solo: Compilatore JavaScript online