演绎js与功能js：将它们分开？一般建筑？

Question

这是一般性的问题。

很多时候，我需要为网页编写JavaScript。记住最佳实践，不引人注目的js等。我将JavaScript放在单独的* .js文件中。每个页面都有自己的js文件。最近有点困扰我的是表现代码与功能代码的混合，我总是最终得到它。

因此，例如，我会为一个元素分配一个.click处理程序。在该单击时，元素必须更改其外观，并且必须对服务器进行AJAX调用。所以，现在，我会在.click处理程序中执行这两项操作。根据需要完成的工作，它可能会变得笨重。当我在一周没有触摸它们之后回到这些代码块时，我常常觉得当我只需要修复一些外观时，需要花费太多时间来查找所有代码行。

无论如何，对演示js 与功能js 的架构/设计有任何想法？将它们保存在一个文件中，但分成不同的功能？将它们分成两个单独的文件？别管他们了？

Answer 1

我觉得在每个动态生成的页面中有三个JS文件很有用。在任何地方重复使用的常规函数​​，在整个项目中使用的项目特定函数以及特定于页面的js文件。通过这种方式，您可以处理“可重用”和“可重用”的内容。这也鼓励您“推广”您的代码。

当你“推广”它时，你会发现自己将它越来越多地分为UI或行为。随着更多东西被分离，您可能会发现自己包含6个文件或者只是打破每个文件的包结构，如您之前建议的UIFunctions（）。doStuff（）...但是如果您必须使用PageName为您的东西添加前缀，那么您没有提升你的代码，也许是时候了： - ）

这就是我一直在做的事情。

Answer 2

我倾向于将它们全部放在一起，这些事件与踢它们的事件有关，但有时会调用函数来执行特定的事情。 例如：

function domyUIstuff(myevent, myselector)
{
// stuff here
};
function domyBehaviorStuff(myevent, myselector)
{
//dostuffhere
};
$(selector).click(function(e)
{
   domyUIstuff(e,$(this));
   domyBehaviorStuff(e,$(this));
};

旁注：我确实从不同的用户控件中分离了一些东西（我做了很多asp.net的东西） - 我为myusercontrol.ascx创建了一个myusercontrol.js文件，为mypage创建了一个mypage.js文件.aspx在调试时往往会减少“噪音” - 我将“通用”函数放在我可能从我的控件调用的页面文件中，例如泛型ajax消息处理程序或通用“实用程序”函数。