为什么我们在DOM中需要event.stopPropagation()?这是不好的建筑模式吗? [英] Why do we need event.stopPropagation() in DOM? Is it bad architectural pattern?
问题描述
在日常的前端开发中，我经常将DOM用作全局事件总线，客户端应用程序的每个部分都可以访问它.
In the everyday front-end development I often use DOM as a global event bus that is accessible to every part of my client-side application.
但是，在我看来，其中有一个功能"被认为是有害的:任何侦听器都可以阻止传播通过此总线"发出的事件.
But there is one "feature" in it, that can be considered harmful, in my opinion: any listener can prevent propagation of an event emitted via this "bus".
所以，我想知道何时可以使用此功能.允许一个听众禁用"所有其他听众是否明智?如果该侦听器不具备做出正确决策所需的全部信息，该怎么办?
So, I'm wondering, when this feature can be helpful. Is it wise to allow one listener to "disable" all the other? What if that listener does not have all information needed to make right decision about such action?
更新
这不是有关冒泡和捕获的内容" 或"Event.stopPropagation实际工作方式"的问题. 这是关于这是一个好的解决方案，允许任何订户影响事件流"的问题吗?
This is not a question about "what is bubbling and capturing", or "how Event.stopPropagation actually works". This is question about "Is this good solution, to allow any subscriber to affect an event flow"?
推荐答案
我们需要(我说的是JS中的当前用法)stopPropagation()，当我们要防止侦听器相互干扰时.但是，并非必须这样做.
We need (I am talking about current usage in JS) stopPropagation() when we want to prevent listeners to interfere with each other. However, it is not mandatory to do so.
避免使用stopPropagation的实际原因:
-
使用它通常意味着您知道代码正在等待同一事件，并且会干扰当前侦听器的工作.如果是这种情况，那么这里可能存在 (见下文)设计问题.我们试图避免在多个不同的地方管理一件事情.
Using it usually means that you are aware of code waiting for the same event, and interfering with what the current listener does. If it is the case, then there may (see below) be a design problem here. We try to avoid managing a single thing at multiple different places.
可能有其他侦听器在等待相同类型的事件，而不会干扰当前侦听器的操作.在这种情况下，stopPropagation()可能会成为问题.
There may be other listeners waiting for the same type of event, while not interfering with what the current listener does. In this case, stopPropagation() may become a problem.
但是，假设您将一个魔术侦听器放在一个容器元素上，并在每次单击时触发以执行某种魔术.魔术侦听器只知道魔术，而不是文档(至少在魔术之前).它做一件事.在这种情况下，让它只知道魔术是一个不错的设计选择.
But let's say that you put a magic listener on a container-element, fired on every click to perform some magic. The magic listener only knows about magic, not about the document (at least not before its magic). It does one thing. In this case, it is a good design choice to leave it knowing only magic.
如果有一天您需要阻止特定区域的点击触发这种魔力，因为将特定于文档的区别暴露给魔力侦听器很不好，那么明智的做法是防止传播到其他地方.
If one day you need to prevent clicks in a particular zone from firing this magic, as it is bad to expose document-specific distinctions to the magic listener, then it is wise to prevent propagation elsewhere.
一个更好的解决方案可能是(我认为)有一个侦听器来决定是否需要调用魔术函数，而不是魔术函数是可停止的侦听器.这样，您可以在不暴露任何东西的情况下保持清晰的逻辑.
An even better solution though might be (I think) to have a single listener which decides if it needs to call the magic function or not, instead of the magic function being a stoppable listener. This way you keep a clean logic while exposing nothing.
提供(我说的是API设计)是一种使订户影响流程的方法并没有错；它取决于此功能的需求.这对于使用它的开发人员可能有用.例如，stopPropagation在很多人中一直(并且非常)有用.
To provide (I am talking about API design) a way for subscribers to affect the flow is not wrong; it depends on the needs behing this feature. It might be useful to the developers using it. For example, stopPropagation has been (and is) quite useful for lots of people.
某些系统实现了continueX方法而不是stopX.在JavaScript中，当被调用方可以执行一些异步处理(如AJA *请求)时，这非常有用.但是，它不适用于DOM，因为DOM需要及时生成结果.我认为stopPropagation是DOM API的明智设计选择.
Some systems implement a continueX method instead of stopX. In JavaScript, it is very useful when the callees may perform some asynchronous processing like an AJA* request. However, it is not appliable to the DOM, as the DOM needs results in time. I see stopPropagation as a clever design choice for the DOM API.
这篇关于为什么我们在DOM中需要event.stopPropagation()?这是不好的建筑模式吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
