Amaliyotda qanday dizayn shablonlarini ishlatdingiz…

Am amaliyotda quyidagi dizayn shablonlarini qoʻlladim:

Fabrika usuli (Factory Method): Turli turlar ob'ektlarni yaratish uchun, aniq sinfni ko'rsatmasdan. Ma'lumot manbalari yoki konfiguratsiyalar bilan ishlashda qulay.

// Fabrika usulidan foydalanish misoli
class DataReader {
  read() {
    throw new Error("Usul amalga oshirilmagan");
  }
}

class FileReader extends DataReader {
  read() {
    console.log("Fayldan ma'lumot o'qish...");
  }
}

class NetworkReader extends DataReader {
  read() {
    console.log("Tarmoqdan ma'lumot o'qish...");
  }
}

class DataReaderFactory {
  createReader(type) {
    switch (type) {
      case "file":
        return new FileReader();
      case "network":
        return new NetworkReader();
      default:
        throw new Error("Noma'lum o'quvchi turi");
    }
  }
}

const factory = new DataReaderFactory();
const fileReader = factory.createReader("file");
fileReader.read();

Singleton (Yagona): Faqat bitta sinf nusxasi mavjudligini ta'minlash va unga global kirishni ta'minlash. Ko'pincha konfiguratsiya menejerlari yoki ma'lumotlar bazasi ulanishlari uchun ishlatiladi.

// Singleton misoli
class ConfigManager {
  constructor() {
    if (ConfigManager.instance) {
      return ConfigManager.instance;
    }
    this.config = {};
    ConfigManager.instance = this;
  }

  setConfig(key, value) {
    this.config[key] = value;
  }

  getConfig(key) {
    return this.config[key];
  }
}

const instance1 = new ConfigManager();
const instance2 = new ConfigManager();

console.log(instance1 === instance2); // true

Kuzatuvchi (Observer): "birga-ko'p" bog'lanishni amalga oshirish uchun, bunda bir ob'ekt (egalar) holati o'zgarganda, avtomatik ravishda barcha bog'liq ob'ektlar (observers) xabardor qilinadi. Bildirishlar tizimlari, reaktiv interfeyslar uchun ishlatiladi.

// Kuzatuvchi misoli
class Observable {
  constructor() {
    this.observers = [];
  }

  subscribe(observer) {
    this.observers.push(observer);
  }

  unsubscribe(observer) {
    this.observers = this.observers.filter(obs => obs !== observer);
  }

  notify(data) {
    this.observers.forEach(observer => observer.update(data));
  }
}

class Observer {
  update(data) {
    console.log("Yangilash olindi:", data);
  }
}

const observable = new Observable();
const observer1 = new Observer();
const observer2 = new Observer();

observable.subscribe(observer1);
observable.subscribe(observer2);

observable.notify("Yangi ma'lumot mavjud!");

Strategiya (Strategy): Algoritmlar oilasini aniqlash, har birini inkapsulyatsiya qilish va ularni almashtirish imkonini berish. Bu algoritmni mijozlardan mustaqil ravishda o'zgartirishga imkon beradi. Ma'lumotlarni qayta ishlash yoki operatsiyalarni bajarish uchun turli variantlar.

// Strategiya misoli
class PaymentStrategy {
  pay(amount) {
    throw new Error("Usul amalga oshirilmagan");
  }
}

class CreditCardPayment extends PaymentStrategy {
  pay(amount) {
    console.log(`${amount} to'lash Kredit karta bilan`);
  }
}

class PayPalPayment extends PaymentStrategy {
  pay(amount) {
    console.log(`${amount} to'lash PayPal bilan`);
  }
}

class PaymentContext {
  setStrategy(strategy) {
    this.strategy = strategy;
  }

  executePayment(amount) {
    this.strategy.pay(amount);
  }
}

const context = new PaymentContext();
context.setStrategy(new CreditCardPayment());
context.executePayment(100);

context.setStrategy(new PayPalPayment());
context.executePayment(50);

Dekorator (Decorator): Ob'ektga dinamik tarzda yangi funksionallik qo'shish uchun, uning tuzilmasini o'zgartirmasdan. Mavjud ob'ektni o'rab, unga o'xshash interfeysni taqdim etadi, lekin qo'shimcha funksiyalar bilan. Loglash, validatsiya, kechiktirish uchun qulay.

// Dekorator misoli
class Component {
  operation() {
    return "Asosiy komponent";
  }
}

class Decorator {
  constructor(component) {
    this.component = component;
  }

  operation() {
    return this.component.operation();
  }
}

class ConcreteDecoratorA extends Decorator {
  operation() {
    return `ConcreteDecoratorA(${super.operation()})`;
  }
}

class ConcreteDecoratorB extends Decorator {
  operation() {
    return `ConcreteDecoratorB(${super.operation()})`;
  }
}

const simple = new Component();
console.log(simple.operation());

const decoratorA = new ConcreteDecoratorA(simple);
console.log(decoratorA.operation());

const decoratorB = new ConcreteDecoratorB(decoratorA);
console.log(decoratorB.operation());

Modul (Module): Node.jsda modul tizimi (CommonJS, ES Modules) o'rnatilgan bo'lsa-da, JavaScriptda Module pattern (nativ modullar paydo bo'lishidan oldin) maxfiy a'zolar va jamoat interfeysini yaratish uchun ishlatilgan. Bu kodni inkapsulyatsiya qilish uchun asosiy usul.

Ushbu shablonlar meni kodni yanada tuzilgan, kengaytiriladigan va saqlash uchun qulay qilishga yordam berdi.

Amaliyotda qanday dizayn shablonlarini ishlatdingiz?