5

现在我正在开发相当庞大而复杂的 webapp,并且必须处理大量的客户端 js 代码,为了让我的生活更轻松,我正在尝试尽可能多地解耦这些代码。

Nicholas Zakas ( http://www.youtube.com/watch?v=vXjVFPosQHw ) 和 Addy Osmani ( http://addyosmani.com/largescalejavascript ) 讨论了可扩展的 js 架构,并尝试应用一些他们对我的工作的想法。

我已经将所有代码分离到多个独立模块中,并通过某种中介处理所有相互通信。这种方法在大多数情况下效果很好。但在某些情况下,我认为这还不够

我正在研究的模块之一代表了一个非常复杂的类似列表的结构。这里有一些简化的例子:

非常简化的例子

除了一些渲染逻辑,负责这块页面的模块应该处理:

  • 分页
  • 切换组
  • 用 dnd 移动元素和组
  • 剪切/复制/粘贴元素和组
  • 令人耳目一新的确定组/元素
  • 元素中的一些逻辑
  • 在不久的将来可能会有更多的东西

我已经执行了所有我可以执行的无关逻辑(例如编辑和删除逻辑通过事件执行到另一个模块),但是模块大小仍然很大(超过 1K 行代码),我不知道如何减少它。此外,我正在为我的模块使用模块模式,因此在多个文件之间分离逻辑更加困难。

所以我来这里问有没有办法在单个模块中解耦复杂的逻辑?

更新:

我想澄清一件事。我很清楚如何 在我的代码中跨多个文件分离模块(“模块”来自模块模式) 。

但我真正寻找的是在单个模块(NKZ 演示文稿中的“模块”) 中分离关注点的逻辑方法。

4

1 回答 1

1

要将单个模块解耦为多个文件,我建议使用此页面http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html上的增强模式

此外,这里还有一些关于创建可扩展 JS 应用程序的资源:

这是 Nicholas Zakas 关于“创建可扩展的 JavaScript 应用程序架构”的演示视频。http://www.youtube.com/watch?v=7BGvy-S-Iag

另一个很好的资源http://addyosmani.com/largescalejavascript/

了解这些概念将使您能够构建一个能够无缝地将模块放入和取出的应用程序。您将能够更改模块而不影响任何其他模块,因为您的程序将是松散耦合的。此外,如果您选择将基础库(例如 KnockoutJS 切换到 Angular),该框架将允许您轻松交换基础库,而不会破坏您的大部分代码。

此外,使用模块和中介或沙箱将使您的代码更容易测试。测试在任何重要的应用程序中都很重要。我希望这有帮助!

于 2013-08-08T15:48:03.557 回答