你如何组织你的javascript代码?

用于 真的? JS重应用程序,你应该尝试模仿Java。

• 在HTML中尽可能少地使用JS(最好只调用bootstrap函数)
• 将代码分解为逻辑单元,并将它们保存在单独的文件中
• 使用脚本将文件连接/缩小为一个包,您将作为应用程序的一部分使用。
• 使用JS命名空间以避免混淆全局命名空间:

var myapp = {}; 
myapp.FirstClass = function() { ... }; 
myapp.FirstClass.prototype.method = function() { ... }; 
myapp.SecondClass = function() { ... }; 

将所有这些技术一起使用将产生一个非常可管理的项目,即使您没有使用任何框架。

我使用不引人注目的javascript,因此,在脚本标记之外,我不会在HTML中保留任何javascript。

两者完全分离。

当DOM树完成时,将启动一个javascript函数,该函数将遍历HTML并添加javascript事件,以及其他需要更改的内容。

为了组织,我倾向于使用一些与HTML页面相似的javascript文件,然后对于常见的函数,我倾向于按它们所做的分组,并选择一个解释这一点的名称。

因此,例如,如果我有UI函数,那么我可以称它们为:myapp_i_functions.js

我尝试将应用程序的名称放在文件名中,除非有一些对多个项目(如strings.js)通用的javascript。

我有(通常)一个文件,其中包含一系列函数,就是这样。它包含在每个使用JavaScript的页面中。在页面中,我将调用以下函数:

$(function() {
  $("#delete").click(delete_user);
  $("#new").click(new_user);
});

哪里 delete_user() 和 new_user() 在外部文件中定义。

我也使用不引人注目的javascript,对我来说这意味着 jQuery (还有其他不引人注目的图书馆)。

您不希望每个页面都有单独的文件。这只意味着更多不必要的外部HTTP请求。假设你已经有效地缓存了一个文件,它将被下载一次,就这样(直到它改变)。

如果我有大量的javascript或者站点被有效地分割成多个区域,那么我可以分割javascript,但情况并非如此。

另外,就我的源代码而言,我可能有多个JS文件,但最终常常会将它们组合成一个客户端下载(以减少HTTP请求)。

更多在 Multiple javascript/css files: best practices? 和 Supercharging Javascript in PHP .

作为jquery插件,我已经重写了很多可重用的代码。当我开始做ASP.NET MVC时,我从原型移到了jquery。加班,我已经迁移了很多我的可重用代码,或者至少是思想,从基于原型的OO到jquery风格的插件。其中大部分存储在自己的JS文件中(主要是内部网应用程序),因此尽管有额外的请求,页面加载速度还是相当高。我想如果需要的话,我可以添加一个构建步骤来合并这些内容。

我还讨论了一种母版页方法,它使用ContentPlaceholder来处理右前结束体标记的脚本。标准jquery/jquery用户界面将被加载,任何其他常见的JS都将位于masterpage中脚本占位符的前面。我在masterpage的顶部有一小段JS,它定义了一个数组,其中包含了部分视图在页面加载时需要运行的任何函数。这些函数是从masterpage中的基本document.ready()函数运行的。

我所有的JS都与我的标记完全分离。有些JS可能存在于部分视图中——当部分可能被包含多次以使其特定于该视图的实例时,这些JS会被封装——但通常不会。通常只包含在占位符中,以便将其加载到页面底部。

另外,如果你想变得很重,那就去看看Mochikit: http://www.mochikit.com/

我发现,如果您希望使用OO方法来开发您的javascript是干净的、可读的,甚至有点安全的话,那么使用OO方法来开发它是一种可行的方法。我发布了以下问题

Cleanest format for writing javascript objects

在如何编写好我的javascript代码方面得到了一些极好的响应。如果遵循这些基本原则,几乎可以轻松地使用任何库,如yui、jquery和原型。