Nesne İnşası

Coddy'nin JavaScript Journey'sinin Nesne Yönelimli Programlama bölümünün bir parçası — ders 49 / 56.

Derin kalıtım ve "has-a" ilişkisi ile ilgili sorunları anladığımıza göre, küçük, yeniden kullanılabilir bileşenleri birleştirerek nesnelerin nasıl oluşturulacağını öğrenelim. Bu yaklaşım bize maksimum esneklik sağlar!

Temel Desen:

// Adım 1: Küçük, odaklanmış bileşenler oluşturun
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`);
  }
}

// Adım 2: Bileşenleri birleştirerek nesneler oluşturun
class Car {
  constructor(brand, enginePower, wheelCount) {
    this.brand = brand;
    this.engine = new Engine(enginePower);    // Bir motora SAHİPTİR (HAS-A)
    this.wheels = new Wheels(wheelCount);     // Tekerleklere SAHİPTİR
  }
  
  drive() {
    console.log(`${this.brand} is driving:`);
    this.engine.start();
    this.wheels.rotate();
  }
}

// Adım 3: Bileşik nesneyi kullanın
const myCar = new Car('Toyota', 150, 4);
myCar.drive();
// Çıktı:
// Toyota is driving:
// Engine (150HP) starting...
// 4 wheels rotating

Gerçek Güç: Bileşenleri Karıştırın ve Eşleştirin:

// Daha özelleşmiş bileşenler
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`);
  }
}

// Farklı kombinasyonlarla farklı arabalar oluşturun
class SportsCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(300);
    this.wheels = new Wheels(4);
    this.turbo = new TurboCharger();      // Spor araba turbo alır
    this.soundSystem = new SoundSystem('Premium'); // Ve iyi ses sistemi
  }
  
  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);
    // Ekonomi sınıfı araç için turbo yok
    this.soundSystem = new SoundSystem('Basic'); // Sadece temel ses sistemi
  }
  
  drive() {
    console.log(`${this.brand} driving efficiently:`);
    this.engine.start();
    this.wheels.rotate();
    this.soundSystem.playMusic();
  }
}

// Bunun ne kadar esnek olduğunu görün!
const ferrari = new SportsCar('Ferrari');
const honda = new EconomyCar('Honda');

ferrari.raceMode();  // Turbo desteği var!
ferrari.cruise();    // Premium ses sistemi var!

honda.drive();       // Sadece temel özellikler

Bu yaklaşım, karmaşık kalıtım zincirleri olmadan davranışları karıştırıp eşleştirme esnekliği sağlar!

Görev

SmartBulb.js dosyasındaki SmartBulb metotlarını tamamlayın.

Işığı açmak için activate() metodunu uygulayın.
Parlaklığı ayarlamak ve tam olarak şu mesajı günlüğe kaydetmek için adjustBrightness() metodunu uygulayın: Brightness set to ${this.brightness.level}%

Kopya kağıdı

Nesneler, derin kalıtım kullanmak yerine küçük, yeniden kullanılabilir bileşenleri birleştirerek oluşturulabilir. Buna kompozisyon denir ve "has-a" (sahip olma) ilişkisini takip eder.

Temel kompozisyon deseni:

// Adım 1: Küçük, odaklanmış bileşenler oluşturun
class Engine {
  constructor(power) {
    this.power = power;
  }
  
  start() {
    console.log(`Engine (${this.power}HP) starting...`);
  }
}

// Adım 2: Bileşenleri birleştirerek nesneler oluşturun
class Car {
  constructor(brand, enginePower) {
    this.brand = brand;
    this.engine = new Engine(enginePower);  // Bir motora SAHİPTİR
  }
  
  drive() {
    this.engine.start();
  }
}

Esneklik için bileşenleri karıştırın ve eşleştirin:

class TurboCharger {
  boost() {
    console.log('Turbo engaged!');
  }
}

class SportsCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(300);
    this.turbo = new TurboCharger();  // Turbo bileşeni ekle
  }
  
  raceMode() {
    this.engine.start();
    this.turbo.boost();
  }
}

class EconomyCar {
  constructor(brand) {
    this.brand = brand;
    this.engine = new Engine(100);
    // Turbo bileşeni yok
  }
}

Kompozisyon, karmaşık kalıtım zincirleri olmadan farklı özellik kombinasyonlarına sahip nesneler oluşturmanıza olanak tanır.

Kendin dene

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