您如何向他人解释“关注分离”？

如果您的同事不了解“关注分离”的好处，或者对它的理解不足以在他们的日常工作中保持一致，那么您将如何向他们解释？

假设您有一个已发布的程序。一位客户出现并提出向您付款，以增强其功能之一。为了赚钱，您将需要更改程序以添加新功能。一些会影响您的利润率的因素是：

1. 您必须更改多少代码
2. 进行更改有多容易
3. 您破坏其他客户正在使用的现有功能的可能性有多大
4. 您可以重用多少现有模型/架构

关注点分离可帮助您对这些问题获得更积极的答案。

1. 如果针对应用程序特定行为的所有代码都被分离出来，那么您只需更改与新功能直接相关的代码即可。哪些应该更改的代码更少。
2. 如果您感兴趣的行为与应用程序的其余部分完全分开，则很有可能您可以交换新的实现，而不必完全理解或操纵程序的其余部分。还应该更容易找出需要更改的代码。
3. 与必须更改的代码相比，不必更改的代码中断的可能性较小。因此，分散关注点有助于避免不必要的功能中断，从而避免了您不得不更改它们可以调用的代码的麻烦。如果您的功能混合在一起，则在尝试更改另一个功能时可能会偶然更改一个功能。
4. 如果您的体系结构与技术或业务逻辑细节无关，则对实现的更改不太可能需要新的体系结构功能。例如，如果您的主域逻辑与数据库无关，那么支持新数据库应该与在持久层的新实现中交换一样容易。

看医院，考虑一下为患者提供护理的所有不同角色：分诊护士，医生，医疗助手，技术人员，文书人员，自助餐厅等。

有谁知道所有这些人是如何完成工作的？不，因为那将是压倒性的。他们必须将不同的职责划分为不同的角色，并且这些角色之间的接触点非常具体。

如果他/她在办公室工作，以它为例，解释每个员工在该办公室中的角色，然后问他，如果不按工作岗位划分这些员工，会发生什么？

我将看看他是如何在他的代码/设计中未能应用SoC的，并将其变成一个可以与他联系的真实示例，这显然是不希望的。

例如，如果他所在的班级中客户需要提供与这些客户无关的几条信息，那么我将使用一家面包店的类比，如果要购买，则必须自备谷物和酵母一个面包。

一个示例可能是html开发人员，可能希望将html，css和javascript分离为单独的文件。这样，您可以通过简单地修改css或更改单独加载的javascript文件的行为来更改某些内容的外观。如果您有一个自适应站点或自适应站点，则此范例效果很好，因为您可以根据用户视口或用户代理加载不同的CSS或JavaScript。但是，如果您修改html或模板，则css或javascript都有可能损坏。这些单独的关注点也可能是相关的。

另一种方法是将所有CSS CSS和html捆绑到一组组件或模块中。这意味着您可以对一个模块进行更改，并且不会影响它旁边运行的页面上与之无关的其他组件或模块。在这里，css，js和html文件合并为一个可以进行单元测试的组件。因此，关注点的分离是以可以进行单元测试的单个原子组件的形式出现的，而不是标记，样式和行为元素的分离。第二种方法更适合于创建更复杂的Web应用程序。

编辑。由于我对此评论持否定态度，因此我认为我会重新审视并尝试限定我的一些观点。不幸的是，这里的反馈并不是特别有建设性，但我确实在其他地方看到了一个有趣的讨论，其中讨论了React，Web开发中的当前热门技术，一个真实的示例，并询问是否打破了关注点分离，或者尤其是打破了关注点之一。 Feather的SOLID面向对象设计方法的原理。

技术JavaScript开发人员观点

NO, because JSX is a view language. That's one responsibility.
BUT, this implies that the JS developer is self-enforcing SoC/SRP on his own      architecture by not mixing ViewModel concerns in his JSX. This type of vigilance "in the wild" is highly suspect because JSX involves the full JavaScript dialect.

UX / UI设计器角度

YES, because JSX mixes Semantic Content (Model) with Behavior (Controller)
YES, because the intrusion, specifically of JavaScript, into the Semantic Model makes it difficult or impossible for me to play my role and leverage my expertese and skills.

团队视角

NO, if both...
Separate files are used for the View (JSX) and ViewModel (JS).
Either there aren't UI/UX/Designers involved, or they are productive working    directly with JSX (not very common).
YES, if either...
Everything is in the same file, causing problems for version control or productive use of modern editors.
Members of the team who are comfortable with HTML/CSS but less capable with JavaScript are excluded because of mixture or roles.

https://hashnode.com/post/does-react-really-violate-separation-of-concern-by-putting-html-and-js-in-a-single-file-cil3bn5hj0011a65347rsdut0

页面上还提供了指向Facebook皮特·亨特（Pete Hunt）有趣的演讲的链接，他在演讲中谈到组件而不是模板，并在语言应用程序中分离出关注点，而不是分离出框架，模板，css和javascript的关注点等等

关于使用应用程序语言来分离您的关注点，这可能涉及使用各种模式将您的代码分离或分离为可以进行单元测试的模块化形式。

综上所述，分离出关注点可能取决于您的角色或观点，如其他地方所述。