自己的 pubsub 实现与使用 addEventListener() + CustomEvent 相比？

Question

自制的 pubsub 系统和 addEventListener() 加上使用 new CustomEvent 之间有更大的区别吗？

pubsub (taken from here) 的伪代码实现：

// Publishing to a topic:
events.publish('/page/load', {
    url: '/some/url/path' // any argument
});
// ...and subscribing to said topic in order to be notified of events:

var subscription = events.subscribe('/page/load', function(obj) {
    // Do something now that the event has occurred
});

// ...sometime later where I no longer want subscription...
subscription.remove();

原生 API:

var event = new Event('build');

// Listen for the event.
elem.addEventListener('build', function (e) { ... }, false);

// Dispatch the event.
elem.dispatchEvent(event);

问题

两者会做同样的工作吗？（我也这么认为？）
所以实际上有什么明显的区别吗？喜欢表演？
如果两种方式都可以使用，两者的优缺点是什么？

我个人认为如果你自己实现它 API 看起来比使用提供的 API 更优雅。但这不是技术争论。 :)

资源

Answer 1

我没有使用 CustomEvent 的经验，但查看 MDN，我缺少对移动设备和 IE 的支持。上次我不得不处理本地事件 + 自定义负载；很痛苦。

Will both do the same job? (I think so?)

没有。本机实现与 DOM 紧密耦合。如果您的用例不涉及 DOM，imo。它有太多的膨胀来处理事件冒泡、取消、传播等，而我在我的 pubsubs 中发布的事件对象通常是原始有效负载。

So is there actually any noticeable difference? Like performance? What are the pros and cons of both if both ways can be used?

本机实现经过了相当多的实战测试。它的功能有限，但应该不足为奇。

自定义实现可以更好地满足您的需求和您个人的编程方式。它通常在功能上更丰富，更精简，阅读起来更流畅。但它可能包含错误。

在性能方面，我不知道本机实现在内部优化了多少，或者是否很容易超越。我不确定如何设置一个好的测试来在公平的竞争环境中测试这两种方法。

I personally think if you implement it yourself the API looks more elegant than using the provided API. But this is not a technical argument. :)

优雅很少是一个自给自足的目标。优雅的代码比 read/scan 更快，更易于理解，因此更不容易出错。整体更快的开发可能不是技术论点，但绝对是一个值得考虑的论点。

最终取决于您，本地事件是否适合您的特定需求，或者您是否更适合使用自定义 pubsub。但对我来说，

var waitinForOk = okBtn.once('click', function(){...});
//...
if(cancelled) waitinForOk.stop();

读起来比

好

var okHandler = function(){ 
  okBtn.removeEventListener('click', okHandler); //once
  //... 
};
okBtn.addEventListener('click', okHandler);
//...
if(cancelled) okBtn.removeEventListener('click', okHandler);

自己的 pubsub 实现与使用 addEventListener() + CustomEvent 相比？

Own pubsub implementation vs using addEventListener() + CustomEvent?

javascript

events

design-patterns

publish-subscribe

问题

资源