Tworzenie obiektów

Część sekcji Programowanie obiektowe ścieżki JavaScript w Coddy. Lekcja 49 z 56.

Teraz, gdy rozumiemy problemy związane z głębokim dziedziczeniem i relacją „ma”, nauczmy się budować obiekty przez łączenie małych, wielokrotnego użytku komponentów. To podejście daje nam maksymalną elastyczność!

Podstawowy wzorzec:

// Krok 1: Utwórz małe komponenty o jasno określonych zadaniach
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`);
  }
}

// Krok 2: Twórz obiekty, łącząc komponenty
class Car {
  constructor(brand, enginePower, wheelCount) {
    this.brand = brand;
    this.engine = new Engine(enginePower);    // MA silnik
    this.wheels = new Wheels(wheelCount);     // MA koła
  }
  
  drive() {
    console.log(`${this.brand} is driving:`);
    this.engine.start();
    this.wheels.rotate();
  }
}

// Krok 3: Użyj obiektu złożonego
const myCar = new Car('Toyota', 150, 4);
myCar.drive();
// Wynik:
// Toyota jedzie:
// Silnik (150HP) uruchamia się...
// 4 koła się obracają

Prawdziwa moc: łącz i dopasowuj komponenty:

// Bardziej wyspecjalizowane komponenty
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`);
  }
}

// Twórz różne samochody w różnych konfiguracjach
class SportsCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(300);
    this.wheels = new Wheels(4);
    this.turbo = new TurboCharger();      // Samochód sportowy otrzymuje turbosprężarkę
    this.soundSystem = new SoundSystem('Premium'); // I dobry system 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);
    // Samochód ekonomiczny bez turbosprężarki
    this.soundSystem = new SoundSystem('Basic'); // Tylko podstawowy system audio
  }
  
  drive() {
    console.log(`${this.brand} driving efficiently:`);
    this.engine.start();
    this.wheels.rotate();
    this.soundSystem.playMusic();
  }
}

// Zobacz, jakie to elastyczne!
const ferrari = new SportsCar('Ferrari');
const honda = new EconomyCar('Honda');

ferrari.raceMode();  // Ma turbodoładowanie!
ferrari.cruise();    // Ma nagłośnienie klasy premium!

honda.drive();       // Tylko podstawowe funkcje

To podejście daje Ci elastyczność w łączeniu różnych zachowań bez skomplikowanych łańcuchów dziedziczenia!

Wyzwanie

Uzupełnij metody SmartBulb w pliku SmartBulb.js.

Zaimplementuj metodę activate(), aby włączyć światło.
Zaimplementuj metodę adjustBrightness(), aby ustawić jasność i wypisać dokładnie: Brightness set to ${this.brightness.level}%

Spróbuj swoich sił

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);