web系统的js代码如何设计结构

1、打开一个web系统的项目，对于Java Web的项目一般WebRoot就是该项目的界面资源文件了。当然WebRoot也是可以改名字的，这里就不多说了。如下图所示

2、项目界面资源文件目录说明。一般web界面的文件基本上都是包含css样式目录，js脚本文件目录，界面代码文件或其他图片文件等。如下图所示

3、针对js代码目录结构，刚开始的时候并没有怎么来考虑，就是将所有文件都混杂在一起（如图片文件、js文件、样式文件以及界面文件都在同一个目录，缺点是后期维护不是很方便，结构比较的乱）。如下图所示

4、再后来开发项目的时候，我知道全部文件混杂在一起不好，就采用同类文件放在一个文件目录的方式。这种方式对于大型项目，界面文件目录较多的时候后期维护也是比较的麻烦。如下图所示

5、比较好的js代码结构是在js目录中再创建和界面目录同名的目录文件，每个文件中只放自己相关的js脚本文件。这样设计的缺点就是目录比较多。如下图所示

6、有时候也可以采用在界面文件目录中创建js代码目录。这种方式后期维护比较的方便。缺点是大型复杂界面目录会比较臃肿。如下图所示

7、其实web系统对于js代码的结构设计并没有明确的规范。我感觉最好根据自己所在的公司来统一自己的规范。适合自己项目的结构才是比较好的。