添加一个自定义事件来处理所有用例，为每个用例创建单独的自定义事件，哪个更好？

Question

假设我想创建在某些实体（如姓名、电话号码、地址等）发生更改时触发的自定义事件...处理此问题的正确方法是什么？

第一种方法： 创建单个自定义事件并在 1 个回调中处理所有实体更改

// custom event
  document.dispatchEvent(
    new window.CustomEvent(`ENTITY_UPDATE`, {
      detail: { type: `name || phone || address` }
    })
  )

//listener for the custom events 

document.addEventListner(`ENTITY_UPDATE`, ({detail:{type}}) => {
switch(type) {

case `name`: //handle name change

case `phone`: //handle phone change

case `address`: //handle address change

}

})

第二种方法： 为每个实体创建单独的自定义事件，并为它们提供单独的回调。

// custom event for Team
  document.dispatchEvent(
    new window.CustomEvent(`NAME_UPDATE`, {
      detail: {data }
    })
  )
// event handler

document.addEventListner(`NAME_UPDATE`, ({detail:data}) => {//handle team data})

// similarly we create separate custom events for phone and address

我想独立处理所有实体更改。处理这个问题的正确方法是什么？

我只是想就这里遵循的最佳方法获得意见。

Answer 1

“更好”是一个很难回答的问题（StackOverflow 并不是讨论意见问题的最佳场所），但可以相对客观地看待它。关于速度之类的问题存在争议，但在大多数情况下，特别是如果您独立开发一个项目，可维护性是最重要的。

如果您独立处理所有情况，则单独处理所有事件可能更有意义。它使代码更加一目了然，并且可能更容易进一步修改。

如果您问哪个更快，那么差异几乎可以肯定可以忽略不计。您可以对其进行基准测试，但对于大多数用例来说，它实际上并不重要。