@dao3fun/emitter

轻量级的、零依赖的事件总线，允许您在应用程序的不同部分之间进行解耦通信。

安装

npm install @dao3fun/emitter

使用方法

导入

首先，从包中导入 Emitter 类：

import { Emitter } from "@dao3fun/emitter";

示例 1: 基本用法

下面是一个基本的使用示例，演示了如何注册监听器、触发事件和移除监听器。

// 定义一个类，它将监听事件
class MyListener {
  constructor() {
    // 注册一个名为 'my-event' 的事件监听器
    Emitter.register("my-event", this.onMyEvent, this);
    // 注册另一个名为 'data-loaded' 的事件监听器
    Emitter.register("data-loaded", this.onDataLoaded, this);
  }

  public onMyEvent(message: string): void {
    console.log(`MyListener 收到了 'my-event' 事件，消息是: ${message}`);
  }

  public onDataLoaded(data: { id: number; name: string }): void {
    console.log(`MyListener 收到了 'data-loaded' 事件，数据是:`, data);
  }

  public destroy(): void {
    // 在对象销毁时，移除所有相关的监听器以防止内存泄漏
    console.log("MyListener 正在移除监听器。");
    Emitter.remove("my-event", this);
    Emitter.remove("data-loaded", this);
  }
}

// 创建监听器实例
const listener = new MyListener();

// 触发事件
console.log("触发 'my-event'...");
Emitter.fire("my-event", "大家好!");

console.log("\n触发 'data-loaded'...");
Emitter.fire("data-loaded", { id: 1, name: "测试数据" });

// 销毁监听器实例并移除监听
console.log("\n销毁 listener...");
listener.destroy();

// 再次触发事件，监听器将不再响应
console.log("\n再次触发 'my-event'...");
Emitter.fire("my-event", "这次不会有输出了。");

示例 2: 多个监听器

同一个事件可以有多个监听器，它们会按照注册的顺序被调用。

class Logger {
  log(message: string) {
    console.log(`[Logger]: ${message}`);
  }
}

class Alerter {
  alert(message: string) {
    console.log(`[Alerter]: 准备弹窗显示 - ${message}`);
  }
}

const logger = new Logger();
const alerter = new Alerter();

// 为 'user-login' 事件注册两个不同的监听器
Emitter.register('user-login', logger.log, logger);
Emitter.register('user-login', alerter.alert, alerter);

// 当 'user-login' 事件被触发时，两个监听器都会响应
Emitter.fire('user-login', '用户 aoteman 已登录');
// 输出:
// [Logger]: 用户 aoteman 已登录
// [Alerter]: 准备弹窗显示 - 用户 aoteman 已登录

示例 3: 一次性监听器

有时你可能需要一个只响应一次的监听器。可以在回调函数内部调用 Emitter.remove 来实现这个效果。

class OneTimeListener {
  constructor() {
    Emitter.register('setup-complete', this.onSetupComplete, this);
  }

  onSetupComplete(config: object) {
    console.log('设置已完成，接收到配置:', config);
    console.log('此监听器将自动移除，不再响应未来的事件。');
    // 在回调内部移除监听
    Emitter.remove('setup-complete', this);
  }
}

const oneTime = new OneTimeListener();

Emitter.fire('setup-complete', { theme: 'dark', language: 'zh' });
// 输出:
// 设置已完成，接收到配置: { theme: 'dark', language: 'zh' }
// 此监听器将自动移除，不再响应未来的事件。

// 再次触发，将不会有任何输出
Emitter.fire('setup-complete', { theme: 'light', language: 'en' });

API

Emitter.register(name, callback, context)

注册一个事件监听器。

• name: string: 事件名称。
• callback: (...args: any[]) => void: 事件触发时执行的回调函数。
• context: any: 回调函数的 this 上下文。

Emitter.fire(name, ...args)

触发一个事件，并向所有监听器传递参数。

• name: string: 要触发的事件名称。
• ...args: any[]: 传递给回调函数的可变参数。

Emitter.remove(name, context)

移除一个事件监听器。

• name: string: 事件名称。
• context: any: 要移除的监听器的上下文。必须与注册时提供的上下文相同。