您的位置:首页 > Web前端 > JavaScript

JavaScript代码性能优化总结

2016-04-25 19:10 543 查看
以下代码基本在jQuery的源码里面都可以看得到,如有说的不对的地方,请大家指出。

1.尽量使用源生方法

javaScript是解释性语言, 相比编译性语言执行速度要慢。浏览器已经实现的方法,就不要再去实现一遍了。另外,浏览器已经实现的方法在算法方面已经做了很多优化。

2.避免全局查找

在一个函数中会用到全局对象存储为局部变量来减少全局查找,因为访问局部变量的速度要比访问全局变量的速度要快一些。

eg:<span style="white-space:pre"> </span>function search(){
<span style="white-space:pre"> </span> //当我要使用当前页面地址和主机域名
<span style="white-space:pre"> </span> alert(window.location.href + window.location.host);
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>//最好的方式是如下这样,先用一个简单变量保存起来
<span style="white-space:pre"> </span>function search(){
<span style="white-space:pre"> </span>var location = window.location;
<span style="white-space:pre"> </span>alert(location.href + location.host);
<span style="white-space:pre"> </span>}
3.尽量减少循环次数

少一层循环,就能提高数倍性能。如果要对一个数组的每个元素进行多次操作,尽可能使用一次循环,多次操作,而不是多次循环,每次循环执行一次操作。尤其是在进行多个正则匹配的时候,尽可能合并正则表达式的时候,尽可能合并正则表达式,在一次遍历中尽可能找到相应的匹配。

循环

var objs = [obj1, obj2, obj3],
i = 0;
len = objs.length;

for(i = 0; i < len; i++){
dosth(obj);
}

//当循环遍历的对象是object时,可以采用下面的方式来写:
while(obj = objs[i++]){
dosth(obj);
}


switch

//通常的switch写法
function funa(){}
function funb(){}
function func(){}
switch(con){
case 'a':
funa();
break;
case 'b':
funb();
break;
case 'c':
func();
break;
}
//换种写法试试
function funa(){}
function funb(){}
function func(){}
var funs = {
'a':funa,
'b':funb,
'c':func
};
funcs[con]{};
//备注:取值或函数调用可以用类似方法来做
4.条件分支

将条件分支,按可能性顺序从高到低排列:可以减少解释器对条件的贪色次数。

在同一条件>2分支时,使用switch优于if:switch分支选择的效率高于if,在IE下尤为明显。4条分支的测试,IE下switch的执行时间约为if的一半。

三目运算代替条件分支

<span style="white-space:pre"> </span>if(a > b){
num = a;
}else{
num = b;
}
//换种写法
num = a > b ? a : b;
5.定时器

如果针对的是不断运行的代码,不应该使用setTimeout,而应该是用setInterval,因为setTimeout每一次都会初始化一个定时器,而setInterval只会在开始的时候初始化一个定时器。

<span style="white-space:pre"> </span>var timeoutTimes = 0;
function timeout(){
timeoutTimes++;
if(timeoutTimes < 10){
setTimeout(timeout, 10);
}
}
timeout();
//可以替换为
var intervalTimes = 0;
function interval(){
intervalTimes++;
if(intervalTimes >= 10){
clearInterval(interv);
}
}
var interv = setInterval(interval, 10);
6.创建对象的另外一个方法----不适用New

//连续创建一些简单的object对象,并且拥有默认的属性,会这么写
function jason(){
this.propa = '';
this.propb = [];
this.propc = 0;
}
var objs = [],
i = 0,
obj;

while(i<100){
obj = new jason();
obj.propc = i;
objs.push(obj);
}
//换种写法
unction jason(){
this.propa = '';
this.propb = [];
this.propc = 0;
}
var objs = [],
i = 0,
obj;

while(i<100){
obj = jason();
obj.propc = i;
objs.push(obj);
}
}

7.用作标记的变量尽可能使用布尔类型

直接用true和false做标记,不要使用数字或者字符串的1和0来做标记。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: