.js文件格式

时间:2010-09-20 20:48:04

标签: javascript jquery

我想知道是否有一个很好的参考,如何最好地格式化.js文件?

你是否像对待文件一样对待它们,还是根据它处理的页面分离出功能?您是否创建了可以跨多个页面使用的.js函数,或者为每个页面编写自定义.js文件?

我只是好奇是否有正式的方式,而不仅仅是编写一堆可能或可能不会组合在一起的特定页面或一组页面的函数。现在我尝试按页面的功能进行分组,但我的.js文件非常适合该页面,不确定它们是否可以在不同的页面上使用。

:: UPDATE ::

有些答案具有相同的主题,主要是关于您计划如何处理项目。现在这个项目对我来说真的很新,而且要求很慢。所以我逐页构建它。将来可能会有交叉功能或类似功能。大多数功能都非常特定于特定页面。

将AJAX调用分组为.js是否明智,但后来还有一个包含该页面所有自定义功能的custompage .js。

7 个答案:

答案 0 :(得分:3)

通常使用javascript,您需要减少页面上包含的单独javascript文件的数量,以减少HTTP请求。

答案 1 :(得分:3)

一个很好的起点是你可以看到Rebecca Murphys使用jQuery presentation构建应用程序并阅读她blog post关于使用对象来组织你的js。

答案 2 :(得分:2)

这实际上取决于你想要完成的事情。您是否正在尝试构建一个库,以便在您网站的不同页面上使用?然后你在js中将东西组合在一起,并在一个母版页或每个需要该库的页面中引用它。

你试图划分代码并保持整洁吗?然后为特定页面创建一个单独的js文件。

答案 3 :(得分:1)

它真的取决于你喜欢什么,但我会做nico说的。 (所有在一个文件中用于整个网站上使用的功能。或者为每个页面分割功能。)在一个页面上加载许多javascript文件会增加http流量。

答案 4 :(得分:1)

基于每页处理自定义事件的方法之一是为每个页面定义一个Object保持回调函数。您可以使用<body>的ID或类似内容。

你可以使用类似的东西,

my_app.page_handlers = {
   foo: function() { /* ... */ },
   bar: function() { /* ... */ }
   /* ... */
}

因此,使用<body id="foo">加载的页面将执行函数my_app.page_handlers.foo()

您可以将所有功能转储到一个文件中(例如page_handlers.js),然后在看到需要时将它们移动到自己的文件中。

我喜欢复制Python的模块结构。因此,我可以选择将page_handlers.js分为page_handlers/foo.jspage_handlers/bar.js。诀窍是使用适当的命名空间,使您可以轻松地重构,扩展和共享代码。

答案 5 :(得分:0)

这实际上取决于你正在做什么。

如果每个页面具有完全不同的功能,那么将每个页面的功能分解为不同的文件可能是有意义的。如果您有一些重用,那么您可以将常用函数放在util类中。您可能会尝试使所有内容都面向对象(我的个人方法)。

所以基本上我会说做对你有意义的事情。

答案 6 :(得分:0)

我不知道是否存在关于此的标准,但也许像jQuery,Dojo,YUI Library(由Yahoo!等)等大项目可以向您展示一些好的做法。我特别在JavaScript中做一切面向对象,所以我习惯将不同的js文件中的每个类分开,然后我使用“cat”将所有内容放在一起,然后使用YUI Compressor缩小。对于这个不完整的答案我很抱歉,我也会继续关注这个帖子!