记录我的JS重构计划，以后但凡有所改变都会更新直到重构完毕！目前“某网站”的JS处于一个混乱时期，可以看出除了我之外有不少人的code在里面…

计划分为三个部分：

1. 梳理代码风格

目前使用了jQuery但是没有正确使用jQuery…

例如出现了“this.value = “值”;”原作者为了追求速度而放弃了稳定性，这就失去了使用jQuery的意义。并且还有自己实现的事件代理，这些都可以使用delegate方法优雅的实现。

统一代码风格

目前代码风格有很多，例如同一份文件出现了字符串用单引号和双引号同时使用的问题。这对代码的阅读造成了障碍。

2. 形成组件库

目前有很多相同的功能但是使用了不同的代码实现，做了重复工作且对于维护相当不利！

例如：验证组件在登录、注册、修改个人资料等很多地方都用到了，但是都在各个地方重新写了一份。

注意点：

确保组件不过度设计，够用即可，精简为重！

组件的设计模板使用“书写模块化JS（一）”一文中提到的方式进行，而非以jQuery插件形式。目的是为了保持对CommonJS模块化标准的支持，以备下一步重构！

所有的模块独立成一个文件，在打包时包括到具体的相应js中！

3. 使用Script loader和模块化机制

主要目标是实现更好的脚本载入与更快的页面响应。

主要工作是：

一. 找到或实现好的JS seed库能实现以下功能：

1. 模块化JS机制
2. 并行的脚本载入
3. 脚本的载入与执行分离
4. 自动按需载入
5. 版本控制

二. 实现一个更好的版本管理机制,后台为JS添加上cache标签；

总结

最终实现后每个页面的JS结构如下：

1. seed.js放置于script标签中，用于页面的载入；
2. page.js页面特有的JS，放置于script标签中；page.js还会包含本页面所使用到的库的载入代码；
3. 其余的ku.js为本页使用的库，此js可能为多个。比如：jquery.js/tab.js/validate.js等等。虽然会增加链接数，但是由于有并行下载，且这些JS的载入不会影响浏览器的载入提示符！

重构的三个大原则：

1. 任务重、时间长，一步一步慢慢来（不设期限，但早完成早开心）；
2. 确保任何时候都可以上线（不影响正常工作）；
3. 加快脚本响应，提高用户体验