本文翻译自：Commonly accepted best practices around code organization in JavaScript [closed]
As JavaScript frameworks like jQuery make client side web applications richer and more functional, I've started to notice one problem... 随着像jQuery这样的JavaScript框架使客户端Web应用程序更丰富，更实用，我开始注意到一个问题......
How in the world do you keep this organized? 你是如何保持这种组织的？
- Put all your handlers in one spot and write functions for all the events? 将所有处理程序放在一个位置并为所有事件编写函数？
- Create function/classes to wrap all your functionality? 创建函数/类来包装所有功能？
- Write like crazy and just hope it works out for the best? 写得像疯了似的，只希望它能做到最好？
- Give up and get a new career? 放弃并获得新的职业？
I mention jQuery, but it's really any JavaScript code in general. 我提到了jQuery，但它实际上是任何JavaScript代码。 I'm finding that as lines upon lines begin to pile up, it gets harder to manage the script files or find what you are looking for. 我发现随着线条开始堆积起来，管理脚本文件或找到你要找的东西变得更加困难。 Quite possibly the biggest propblems I've found is there are so many ways to do the same thing, it's hard to know which one is the current commonly accepted best practice. 我发现最大的问题可能是有很多方法可以做同样的事情，很难知道哪一个是目前普遍接受的最佳实践。
Are there any general recommendations on the best way to keep your .js files as nice and neat as the rest of your application? 是否有关于保持.js文件与应用程序其余部分一样美观和整洁的最佳方法的一般建议？ Or is this just a matter of IDE? 或者这仅仅是IDE的问题？ Is there a better option out there? 那里有更好的选择吗？
EDIT 编辑
This question was intended to be more about code organization and not file organization. 这个问题旨在更多地关注代码组织而不是文件组织。 There has been some really good examples of merging files or splitting content around. 有一些非常好的合并文件或分割内容的例子。
My question is: what is the current commonly accepted best practice way to organize your actual code? 我的问题是：目前普遍接受的组织实际代码的最佳实践方法是什么？ What is your way, or even a recommended way to interact with page elements and create reuseable code that doesn't conflict with each other? 您的方式是什么，甚至是推荐的方式与页面元素交互并创建不会相互冲突的可重用代码？
Some people have listed namespaces which is a good idea. 有些人列出了名称空间 ，这是一个好主意。 What are some other ways, more specifically dealing with elements on the page and keeping the code organized and neat? 还有什么其他方法，更具体地说是处理页面上的元素并保持代码整洁有序？
#1楼
参考：https://stackoom.com/question/12JF/JavaScript中代码组织的普遍接受的最佳实践-关闭
#2楼
I use Dojo's package management ( dojo.require and dojo.provide ) and class system ( dojo.declare which also allows for simple multiple inheritance) to modularize all of my classes/widgets into separate files. 我使用Dojo的包管理 （ dojo.require和dojo.provide ）和类系统（ dojo.declare ，它也允许简单的多重继承）将我的所有类/小部件模块化为单独的文件。 Not only dose this keep your code organized, but it also lets you do lazy/just in time loading of classes/widgets. 这不仅可以使您的代码保持井井有条，而且还可以让您懒惰/及时加载类/小部件。
#3楼
Check out JavasciptMVC . 查看JavasciptMVC 。
You can : 您可以 ：
split up your code into model, view and controller layers. 将代码拆分为模型，视图和控制器层。
compress all code into a single production file 将所有代码压缩到单个生产文件中
auto-generate code 自动生成代码
create and run unit tests 创建并运行单元测试
and lots more... 还有更多......
Best of all, it uses jQuery, so you can take advantage of other jQuery plugins too. 最重要的是，它使用jQuery，因此您也可以利用其他jQuery插件。
#4楼
For JavaScript organization been using the following 对于JavaScript组织一直在使用以下内容
- Folder for all your javascript 所有javascript的文件夹
- Page level javascript gets its' own file with the same name of the page. 页面级别javascript获取其自己的文件，其页面名称相同。 ProductDetail.aspx would be ProductDetail.js ProductDetail.aspx将是ProductDetail.js
- Inside the javascript folder for library files I have a lib folder 在库文件的javascript文件夹中，我有一个lib文件夹
- Put related library functions in a lib folder that you want to use throughout your application. 将相关库函数放在要在整个应用程序中使用的lib文件夹中。
- Ajax is the only javascript that I move outside of the javascript folder and gets it's own folder. Ajax是我移动到javascript文件夹之外的唯一的javascript，并获取它自己的文件夹。 Then I add two sub folders client and server 然后我添加两个子文件夹客户端和服务器
- Client folder gets all the .js files while server folder gets all the server side files. 客户端文件夹获取所有.js文件，而服务器文件夹获取所有服务器端文件。
#5楼
您可以将脚本拆分为单独的文件进行开发，然后创建一个“发布”版本，将所有文件一起填入并运行YUI Compressor或其类似的东西。
#6楼
A few days ago, the guys at 37Signals released a RTE control , with a twist. 几天前，37Signals的人发布了一个RTE控件 。 They made a library that bundles javascript files using a sort of pre-processor commands. 他们创建了一个库，使用一种预处理器命令捆绑javascript文件。
I've been using it since to separate my JS files and then in the end merge them as one. 我一直在使用它，因为我将JS文件分开，最后将它们合并为一个。 That way I can separate concerns and, in the end, have only one file that goes through the pipe (gzipped, no less). 这样我可以分开关注点，最后只有一个文件通过管道（gzip，不能少）。
In your templates, check if you're in development mode, and include the separate files, and if in production, include the final one (which you'll have to "build" yourself). 在模板中，检查您是否处于开发模式，幷包含单独的文件，如果在生产中，则包括最后一个（您必须自己“构建”）。