js eventbus

// 定义一个简单的 EventBus 类
class EventBus {
  constructor() {
    this.events = {};
  }

  // 订阅事件
  on(eventName, callback) {
    if (!this.events[eventName]) {
      this.events[eventName] = [];
    }
    this.events[eventName].push(callback);
  }

  // 触发事件
  emit(eventName, data) {
    if (this.events[eventName]) {
      this.events[eventName].forEach(callback => callback(data));
    }
  }

  // 取消订阅事件
  off(eventName, callback) {
    if (this.events[eventName]) {
      this.events[eventName] = this.events[eventName].filter(cb => cb !== callback);
    }
  }
}

// 使用示例
const bus = new EventBus();

// 订阅 'click' 事件
bus.on('click', (data) => {
  console.log('Click event received:', data);
});

// 触发 'click' 事件
bus.emit('click', { x: 100, y: 200 });

// 取消订阅 'click' 事件
const clickHandler = (data) => {
  console.log('Another click handler:', data);
};

bus.on('click', clickHandler);
bus.off('click', clickHandler);

// 再次触发 'click' 事件，只有第一个订阅者会收到消息
bus.emit('click', { x: 300, y: 400 });

解释说明：

1. EventBus 类：定义了一个简单的事件总线类，用于管理事件的订阅、触发和取消订阅。
2. on 方法：用于订阅事件。它接受两个参数：事件名称和回调函数。当该事件被触发时，回调函数会被调用。
3. emit 方法：用于触发事件。它接受两个参数：事件名称和传递给回调函数的数据。
4. off 方法：用于取消订阅事件。它接受两个参数：事件名称和要移除的回调函数。

通过这种方式，你可以轻松地在应用程序的不同部分之间传递消息，而不需要直接依赖或引用彼此。