1、为对象属性建立变量快捷方式
将对象属性赋值给变量,在使用对象属性的时候,用变量代替,有很多好处:
1)减少对象的搜索链
2)变量名比属性可读性更好
3)压缩代码
//以前的写法
document.body.addEventListener("click", function(){
//时间处理程序
});
document.body.className = "user-" + ajaxResult.user[0].user.id;
document.documentElement.setAttribute("data-user-id", ajaxResult.user[0].user.id);
//现在的写法
var doc = document,
body = doc.body,
userid = ajaxResult.user[0].user.id;
body.addEventListener("click", function(){
//时间处理程序
});
body.className = "user-" + userid;
doc.documentElement.setAttribute("data-user-id", userid);
(参考:http://www.gbtags.com/gb/share/1482.htm)
2、尽可能存储 NodeList 和选择器引擎 Collection
通常我们会写出这样的代码:
$(".nav a").css("display", "none");
$(".nav a").css("display", "block");
尽管现在的选择器引擎和浏览器已经在性能上快了不少,但是重复工作始终是会影响性能的。
我们最好是使用变量来存储 DOM 元素:
var $navA = $(".nav a");
$navA.css("display", "none");
$navA.css("display", "block");
(参考:http://www.gbtags.com/gb/share/1478.htm)
3、存储正则表达式
对于正则表达式,通常会有这样的代码
//判断 someValue 是否只包含数字
if(someValue.match(/(\d+)/g)){
}
这种写法的问题是:每次判定都会创建一个正则表达式对象,而需要它们完成的工作确是一样的。
这样的重复工作可以通过将正则表达式存储在一个变量中来避免
var digitsRegex = /(\d+)/g;
myInput.addEventListener("change", function(){
if(myInput.value.match(digitRegex)){
}
}):
(参考:http://www.gbtags.com/gb/share/1454.htm)