做了一个函数式、带类型、超顺手的微型事件库,已发布到 npm

2 天前
 xiaolingxinna

github: https://github.com/Misaka-0x447f/createTypedEvent
npm: https://www.npmjs.com/package/@misaka17535/create-typed-event

相比其他事件库,首先是带类型,让用户能知道 payload 的类型;其次是函数式,不再需要手敲事件名。然后是 sub 函数自动返回 unsub 函数,不再必须传入 sub 时的 listener:

const misakaStateChange = createTypedEvent<{ selfDestructionInProgress: boolean }>()
// returns unsub function without defining handler outside
const unsub = misakaStateChange.sub((payload) => console.log(payload))
misakaStateChange.dispatch({selfDestructionInProgress: true})
unsub()

>>> { selfDestructionInProgress: true }

另外还自带 react hook ,完美桥接 react 响应式变量,如果你想你也可以轻松写出其他响应式框架的版本。

是新包,但是已经在各种内部项目里用了两三年了,用过的同事都说好。

921 次点击
所在节点    Node.js
8 条回复
maocat
2 天前
额,试试加个异步?
xiaolingxinna
2 天前
@maocat 天然支持异步?
xiaolingxinna
2 天前
咦,现在 V2EX 不支持附言了?刚刚写了一下相比其他库的优势:

- rxjs
- 面向对象:需要你创建一个 Observable/Subject 对象。
- 包体积很大: rxjs@7.8.2 本身就有 4.29MB ,而这个库只有 12.5KB (未来可能会更小)。
- mitt
- 需要你写事件名:`emitter.on('xxx'...`
- 不返回取消订阅方法。
- 不支持获取当前值。
Lush
2 天前
支持字符串事件名不是更通用吗,大部分需要发布订阅的场景都是为了解耦,如果一个事件一个变量不就又要 import ,模块之间又耦合了
zthxxx
2 天前
@xiaolingxinna 发包名字太长了影响传播,建议换个名字
akirarika
2 天前
已 star~
nzbin
1 天前
@xiaolingxinna RxJS 4M 那是 npm 包的体积,不是代码引入的大小,你应该看看 dist 目录里面的 esm 包,而且 RxJS 不只是做事件驱动,而是完整的异步解决方案
3085570450tt
1 天前
nanoevents: https://github.com/ai/nanoevents, 都有你提到的功能,同时体积还比你小?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://yangjunhui.monster/t/1136381

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX