STRUCTURAL PATTERN

Facade Pattern

نمط الواجهة

يعني إيه؟ زي زرار واحد بيشغل السينما كلها - TV, Sound, Lights! 🎬
بيخفي التعقيد ورا interface بسيط! 🏠

THE CONCEPT

مثال Home Theater 🎬

Facade = واجهة بسيطة لنظام معقد! 👤 Client 🎬 HomeTheaterFacade watchMovie() endMovie() 📺 TV 🔊 SoundSystem 💡 Lights simple! ❌ من غير Facade tv.on(); sound.on(); sound.setVolume(); lights.dim(); projector.on(); ... ✅ مع Facade facade.watchMovie() 🎬 ✅ Simple interface for complex subsystem!

🎬 Facade

الـ Class اللي بـيبسط التعامل مع نظام معقد - watchMovie() بدل 10 خطوات!

📺🔊💡 Subsystems

الـ Classes المعقدة اللي الـ Facade بيخفيها - TV, Sound, Lights, Projector!

👤 Client

بيستخدم interface بسيط من غير ما يعرف التفاصيل!

الكود 💻

Facade.js
// 📺 Subsystems - معقدة!
class TV {
  on() { return "📺 TV is ON"; }
  off() { return "📺 TV is OFF"; }
}

class SoundSystem {
  on() { return "🔊 Sound ON"; }
  setVolume(level) { return `🔊 Volume: ${level}`; }
  off() { return "🔊 Sound OFF"; }
}

class Lights {
  dim(level) { return `💡 Lights dimmed to ${level}%`; }
  on() { return "💡 Lights ON"; }
}

// 🎬 Facade - بيبسط كل حاجة!
class HomeTheaterFacade {
  constructor() {
    this.tv = new TV();
    this.sound = new SoundSystem();
    this.lights = new Lights();
  }
  
  // 🎯 One simple method!
  watchMovie() {
    return [
      this.lights.dim(10),
      this.tv.on(),
      this.sound.on(),
      this.sound.setVolume(80),
      "🎬 Movie starting..."
    ];
  }
  
  endMovie() {
    return [
      this.sound.off(),
      this.tv.off(),
      this.lights.on(),
      "🎬 Movie ended!"
    ];
  }
}
Usage.js
// 🎯 Simple!
const theater = new HomeTheaterFacade();

theater.watchMovie();
// 💡 Lights dimmed to 10%
// 📺 TV is ON
// 🔊 Sound ON
// 🔊 Volume: 80
// 🎬 Movie starting...

theater.endMovie();
// 🔊 Sound OFF
// 📺 TV is OFF
// 💡 Lights ON
// 🎬 Movie ended!

// ✅ Client مش محتاج يعرف التفاصيل!
// ✅ زرار واحد بدل 10!

جرب! 🎮

🏠

السينما مقفولة

// const theater = new HomeTheaterFacade();
Decorator Flyweight