依照百度前端规范对项目里部分代码的重构
2014-03-19 11:20
567 查看
1.不要用document.write输出js文件(对应百度前端规范14.2节)
重构前在管理学院项目里面,我们为了方便JS组件的调用,并且在换组件的时候无需修改相应的html或模板.,对JS组件进行了模块划分,写了一个输出JS的工具JS,如下
百度前端规范
切勿以document.write输出静态js引用的方式上线!在IE下,document.write无法保证脚本加载的时序性。
重构后
在留学生教务系统里面,我们沿用了EEP的输出JS的工具类:JQueryLoader,保证了js输出的时序性,管理了js直接的依赖关系,并且也有了查重的功能。
2.全局变量冲突(对应百度前端规范15.1节)
重构前在我们所写的js页面里,很多都是直接写本页的js代码
百度前端规范
由于环境的未知性,所有暴露的全局变量都可能产生危险.我们应该使用function隔离作用域.
重构后
利用闭包和立即函数,包裹自己写的JS,避免命名冲突
3.行字符限制(对应百度前端规范1.3节)
重构前一般我们是这样写逻辑判断语句的
百度前端规范
每行的字符数建议不超过100个字符。
过长的程序行应在适当的地方断行,并保持断行后的代码整齐。断行不要破坏表达式本身的意义。
重构后
4.字符串拼接(对应百度前端规范9.1节)
重构前在实验室开发项目时,一般是这样拼接字符串的:
百度前端规范
字符串拼接,应使用数组作为StringBuffer保存字符串片段,使用时调用join方法。避免使用+或+=的方式拼接较长的字符串,每个字符串都会使用一个小的内存片段,过多的内存片段会影响性能。绝大部分现代浏览器都对+=的字符串拼接进行了优化,但IE6的使用率依然很高
字符串拼接:更好的拼接方式,Array,使用临时变量存储数组长度
var str = [], strLen = 0;
for (var i = 0, len = list.length; i < len; i++) {
str[strLen++] = '<div>' + list[i] + '</div>';
}
dom.innerHTML = str.join('');
重构后
5.倒序遍历(对应百度前端规范10.3.2节)
重构前在实验室项目中我们一般是这样遍历数组的:
百度前端规范
当遍历的顺序无关时,建议使用倒序遍历。查找匹配项并删除时,应使用倒序遍历。
重构后
6.清空字符串(对应百度前端规范10.2.2节)
重构前
之前我们一般认为清空字符串是这样的:百度前端规范
我们可以设置数组的length为0来清除数组的所有项。
重构后
赋值为一个空数组以达到清空原数组 这里其实并不能说是严格意义的清空数组,只是将ary重新赋值为空数组,之前的数组如果没有引用在指向它将等待垃圾回收.
,
相关文章推荐
- 依照百度前端规范对项目里部分代码的重构
- 编写可测试的前端代码第二部分 – 从反模式进行重构
- iOS项目工程结构,数据流思想和代码规范 工程结构架构,减少耦合混乱以及防治需求大改造成结构重构,如何构建稳定可扩展可变换的工程结构的思考
- 重构 css 布局 -- 重构公司网站,面向web2.0规范前端项目开发
- 项目开发规范(编码规范、命名规范、安全规范、前端优化、源码提交规范、代码维护规范、产品发布规范)
- Web项目的前台兼容性问题——代码规范篇
- 【前端】一步一步使用webpack+react+scss脚手架重构项目
- 前端项目模块化的实践2:使用 Webpack 打包基础设施代码
- 10、前端代码规范(转载)
- Java web项目 图书管理系统图书修改部分代码
- 编写灵活、稳定、高质量的前端代码的规范一(推荐收藏)
- 关于代码规范的个人观点及伙伴个人项目的代码复审
- 前端代码规范 及 最佳实践
- 《从LRS项目重构看“泛型”(四)——代码实战,将DataTable转成泛型实体集合》
- 由一段代码谈前端js优化和编码规范(一)
- 【项目篇】Android团队项目开发之统一代码规范
- 前端读者 | 百度前端编码规范(JS)
- 项目代码级别重构
- C++项目中编译部分C的代码
- Java web项目 在线网络考试管理员登陆部分代码