返回

深入剖析 Mitt 与 Tiny Emitter:基于源码揭秘发布/订阅模式

前端

引言

在 JavaScript 生态系统中,发布/订阅模式是实现事件驱动的应用程序的关键。它允许组件之间松散耦合地进行通信,促进代码的可维护性和可扩展性。本文将深入探讨 Mitt 和 Tiny Emitter 这两个流行的发布/订阅库的源码,揭示其内部运作机制并展示如何有效地使用它们来构建健壮的应用程序。

Mitt:轻量级发布/订阅核心

Mitt 是一个极简的发布/订阅库,仅提供发布/订阅的核心功能。它没有依赖关系,使得它成为在资源受限的环境中构建自定义事件总线的理想选择。

初始化 Mitt 实例

const mitt = Mitt();

发布事件

mitt.emit('event-name', { data: 'payload' });

订阅事件

const unsubscribe = mitt.on('event-name', (payload) => {
  // 处理事件回调
});

Tiny Emitter:功能丰富的发布/订阅解决方案

Tiny Emitter 扩展了 Mitt 的核心功能,提供了一个更加全面和功能丰富的发布/订阅解决方案。它包括以下附加功能:

  • 事件前缀
  • 事件过滤器
  • 一次性事件

初始化 Tiny Emitter 实例

const tinyEmitter = TinyEmitter();

事件前缀

使用事件前缀可以防止事件名称冲突。

tinyEmitter.on('prefix:event-name', (payload) => {
  // 处理带前缀的事件
});

事件过滤器

事件过滤器允许根据特定条件过滤事件。

tinyEmitter.on('event-name', (payload) => {
  // 只有当 payload.type === 'success' 时才会处理事件
}, { filter: (payload) => payload.type === 'success' });

一次性事件

一次性事件只触发一次,然后自动取消订阅。

tinyEmitter.once('event-name', (payload) => {
  // 只处理一次事件
});

SEO 关键词: