• 观察者模式

  class Subject {
    constructor() {
      this.observers = [];
    }
  
    addObserver(observer) {
      this.observers.push(observer);
    }
  
    removeObserver(observer) {
      const index = this.observers.indexOf(observer);
      if (index !== -1) {
        this.observers.splice(index, 1);
      }
    }
  
    notify(data) {
      this.observers.forEach(observer => observer.update(data));
    }
  }
  
  class Observer {
    update(data) {
      console.log('Received data:', data);
    }
  }
  
  // 创建主题和观察者
  const subject = new Subject();
  const observer1 = new Observer();
  const observer2 = new Observer();
  
  // 添加观察者到主题
  subject.addObserver(observer1);
  subject.addObserver(observer2);
  
  // 通知观察者
  subject.notify('Hello, observers!');
  
  
  
  // @override
  
  class EventBus {
    constructor() {
      this.subscribers = {};
    }
  
    subscribe(event, observer) {
  		if (!this.subscribers[event]) {
  			this.subscribers[event].push(observer);	
  		}
    }
  
    unsubscribe(event, observer) {
  		if (this.subscribers[event]) {
        const index = this.subscribers[event].indexOf(observer);
        if (index !== -1) {
          this.subscribers[event].splice(index, 1);
        }
      }
    }
  
    publish(event, data) {
      this.subscribers[event].forEach(observer => observer.update(data));
    }
  }
  
  class Observer {
    update(data) {
      console.log('Received data:', data);
    }
  }
  
  // 创建事件总线
  const eventBus = new EventBus();
  
  // 定义观察者
  const observer1 = new Observer();
  const observer2 = new Observer();
  
  // 订阅事件
  subject.subscribe('event1', observer1);
  subject.subscribe('event2', observer2);
  
  // 发布事件
  subject.publish('event1', 'Hello, observers!');

• 发布-订阅模式

  class EventBus {
    constructor() {
      this.subscribers = {};
    }
  
    subscribe(event, callback) {
      if (!this.subscribers[event]) {
        this.subscribers[event] = [];
      }
      this.subscribers[event].push(callback);
    }
  
    unsubscribe(event, callback) {
      if (this.subscribers[event]) {
        const index = this.subscribers[event].indexOf(callback);
        if (index !== -1) {
          this.subscribers[event].splice(index, 1);
        }
      }
    }
  
    publish(event, data) {
      if (this.subscribers[event]) {
        this.subscribers[event].forEach(callback => callback(data));
      }
    }
  }
  
  // 创建事件总线
  const eventBus = new EventBus();
  
  // 定义事件处理函数
  const handler1 = data => {
    console.log('Handler 1:', data);
  };
  
  const handler2 = data => {
    console.log('Handler 2:', data);
  };
  
  // 订阅事件
  eventBus.subscribe('event1', handler1);
  eventBus.subscribe('event2', handler2);
  
  // 发布事件
  eventBus.publish('event1', 'Hello, subscribers!');
  eventBus.publish('event2', 'Another event');
  
  // 取消订阅事件
  eventBus.unsubscribe('event1', handler1);
  
  // 再次发布事件
  eventBus.publish('event1', 'Event after unsubscribe');

• 单例模式

  const Singleton = (function() {
    let instance;
  
    function createInstance() {
      // 创建单例对象的代码
      return { /* 单例对象的属性和方法 */ };
    }
  
    return {
      getInstance: function() {
        if (!instance) {
          instance = createInstance();
        }
        return instance;
      }
    };
  })();
  
  // 使用单例对象
  const singletonInstance = Singleton.getInstance();

• 工厂模式

  function createProduct(type) {
    if (type === 'A') {
      return new ProductA();
    } else if (type === 'B') {
      return new ProductB();
    }
    // 其他产品类型的处理逻辑
  }
  
  // 使用工厂创建产品对象
  const productA = createProduct('A');
  const productB = createProduct('B');

• 装饰者模式

  function Component() {
    this.operation = function() {
      // 原始操作的实现
    };
  }
  
  function Decorator(component) {
    this.component = component;
  
    this.operation = function() {
      // 装饰操作的实现
      this.component.operation();
      // 其他装饰操作的实现
    };
  }
  
  // 使用装饰者模式
  const component = new Component();
  const decoratedComponent = new Decorator(component);
  
  decoratedComponent.operation();