循环作为程序语言的三大逻辑控制结构之一,在实际开发是经常会遇到的。在JavaScript程序的循环结构使用上,我们经常会遇到这种应用。根据一个对象的长度进行循环并对对象每个每个元素进行处理。
如
for
(
var
i
=
0
;i
<
a.length;i
++
){
sum += a[i]
}
sum += a[i]
}
以上只是一个简单的示例,对于如上程序,很多程序开发者都研究过关于其执行效率的问题。因此就出现了以下的两种写法:
for
(
var
i
=
0
,iLen
=
a.length;i
<
iLen;i
++
){
sum += a[i]
}
for ( var i = 0 ,item;item = a[i];i ++ ){
sum += item;
}
sum += a[i]
}
for ( var i = 0 ,item;item = a[i];i ++ ){
sum += item;
}
或
for
(
var
i
=
0
,item;(item
=
a[i])
!=
undefined;i
++
){
sum += item;
}
sum += item;
}
对于三种写法其性能到底有多大差异呢?到底哪个的效率更高呢?我在自己的机器上对其做了测试:发现在10000条数据以下时三者执行速度差别不大,差别大概在0.01m左右,而且测试结果不稳定。
然后将数据变为50w条进行测试:三种方法测试结果分别为:
1182
981
1673(而且出现“程序执行缓慢,是否取消该脚本”的提示)
1572
1462
12067(同样出现了脚本加载缓慢的提示)
尽管数据并不是非常稳定,但还是能从中发现点什么的。
速度最快的是第二种写法:即保存对象长度,避免每次都计算。速度最慢的是第三种写法:即不关系对象的长度,而根据当前项是否存在来循环。之前我一直以为是第三种写法速度应该是最快的(因为不用计算长度),今日一测才发现第三种的执行效率如此低下,看来还是避免使用。当然,很多时候我们可能还是不得不使用这第三种写法。
测试程序如下:(建议分开对三个程序进行测试,特别是在FF下)
<
script type
=
"
text/javascript
"
>
<!--
var a = [];
for ( var i = 0 ;i < 500000 ;i ++ ){
a.push( 100 );
}
var sum = 0 ;
var timer1 = new Date().getTime();
for ( var i = 0 ;i < a.length;i ++ ){
sum += a[i];
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer1));
sum = 0 ;
var timer2 = new Date().getTime();
for ( var i = 0 ,iLen = a.length;i < iLen;i ++ ){
sum += a[i];
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer2));
sum = 0 ;
var timer3 = new Date().getTime();
for ( var i = 0 ,item;item = a[i];i ++ ){
sum += item;
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer3));
// -->
< / script>
<!--
var a = [];
for ( var i = 0 ;i < 500000 ;i ++ ){
a.push( 100 );
}
var sum = 0 ;
var timer1 = new Date().getTime();
for ( var i = 0 ;i < a.length;i ++ ){
sum += a[i];
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer1));
sum = 0 ;
var timer2 = new Date().getTime();
for ( var i = 0 ,iLen = a.length;i < iLen;i ++ ){
sum += a[i];
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer2));
sum = 0 ;
var timer3 = new Date().getTime();
for ( var i = 0 ,item;item = a[i];i ++ ){
sum += item;
}
alert(sum + " \ntime: " + ( new Date().getTime() - timer3));
// -->
< / script>