JavaScript中自定义事件处理的不同方式有什么区别？

Question

我在JavaScript中发现了以下有关自定义事件处理的帖子。从这些文章中，有两种方法（至少）处理/解雇自定义事件：

1. 使用DOM方法（createEvent，dispatchEvent）
   • How do I create a custom event class in Javascript?
   • http://the.unwashedmeme.com/blog/2004/10/04/custom-javascript-events/
     
     
2. 自定义代码
   • http://www.nczonline.net/blog/2010/03/09/custom-events-in-javascript/
   • http://www.geekdaily.net/2008/04/02/javascript-defining-and-using-custom-events/

但是，推荐的处理（解雇和订阅）自定义事件的方式是什么？

[编辑] 此问题的上下文不使用任何库，如jQuery，YUI，...但只是简单的JavaScript

[编辑2] 似乎存在细微差别，至少在错误处理方面存在差异。 Dean Edwards（http://dean.edwards.name/weblog/2009/03/callbacks-vs-events/）建议使用前一种方式进行自定义事件处理。我们说这有区别吗？

Answer 1

您描述的是

之间的区别

• 基于自定义事件的邮件传递系统
• 手动触发DOM事件。

前者是一种使用事件进行消息传递的方法。一个例子是创建EventEmitter

后者只是一种手动使用DOM事件系统中构建的浏览器的方法。这基本上是使用原生存在于（主管/现代）浏览器中的DOM 3 Event API。

所以问题就在于你想做什么？消息DOM事件或使用事件传递消息？

Benchmark showing DOM 3 custom events is 98% slower

DOM似乎有巨大的开销。它这样做是因为它支持事件传播和冒泡。这样做是因为它支持将事件绑定到DOMElement。

如果您不需要DOM3事件的任何功能，请使用所选的发布/订阅库。

[编辑2]

这就是错误处理，你如何进行错误处理。如果您知道您的事件发射器是同步的那么这是预期的行为。要么自己进行错误处理，要么使用setTimeout使其异步。

要小心，如果你使它异步，你就会“丢失”事件处理程序在emit / trigger / dispatch调用返回后完成逻辑的保证。这需要完全不同的高级设计，然后假设事件发射器是同步的。 这不是轻易做出的选择

Answer 2

每个人都有利弊。使用适合你的。

使用DOM方法最明显的“骗局”是它们与基于浏览器的部署相关联，并且即使它没有意义，也会将DOM纳入事物中（例如，消息传递与DOM对象），而标准的Observer式实现可以在任何环境中使用，不仅仅是Web浏览器，也可以是您喜欢的任何通用对象。

执行自己的Observer实现最明显的“con”是你已经完成了自己的Observer实现，而不是重用环境中已经存在的东西（测试，调试，优化等）。

Answer 3

许多图书馆已经提供了处理事件的方法，我建议只使用现有的图书馆。如果使用DOM，则假定浏览器提供必要的支持，而如果使用自定义机制，则可能会牺牲自定义实现的速度。如果您依赖现有的库，库可以选择适当的权衡。

例如，Closure提供EventTarget，其界面与DOM机制的界面相似，但不依赖于浏览器为其提供原生支持。