首页 > 代码库 > JavaScript 循环性能比较

JavaScript 循环性能比较

有一句话叫做 没有什么事是一个循环解决不了的,如果真有,那就再来一个循环。

循环的种类有很多

正向for循环,逆向for循环,while循环,for-in循环(理论上性能最差),for-each循环,duff‘s device循环(理论上性能最好)

直接上代码

<html>    <head>        <meta charset="UTF-8">        <title></title>            </head>    <body>            </body>    <script type="text/javascript">        var number = 100000;//array大小        var iteranum = 100;//迭代次数        var array = [];        for(let i=0;i<number;i++)        {            array[i] = i+1;        }        //test cicle         var len = array.length;        //正常for循环        console.time(‘normal for‘);        for(let k=0;k<iteranum;k++)        {            for(let i=0;i<len;i++)            {                array[i]+1;            }        }        console.timeEnd(‘normal for‘);        //倒序for循环        console.time(‘reverse for‘);        for(let k=0;k<iteranum;k++)        {            for(let i=len-1;i--;)            {                array[i]+1;            }        }        console.timeEnd(‘reverse for‘);        //while循环        console.time(‘while‘);        for(let k=0;k<iteranum;k++)        {               let i=0;            while(i<len)            {                array[i]+1;                i++;            }        }        console.timeEnd(‘while‘);        //for-in循环        console.time(‘for-in‘);        for(let k=0;k<iteranum;k++)        {            for(let i in array)            {                array[i]+1;            }        }        console.timeEnd(‘for-in‘);        //for each 循环        console.time("for each");        for(let k=0;k<iteranum;k++)        {            array.forEach(function(e){                e+1;            });        }        console.timeEnd("for each");        //duff‘s device 循环        console.time("device‘s device");        for(let k=0;k<iteranum;k++)        {            let j = len % 8;            let templen = len-1;            while(j){                j--;                array[templen--]+1;            }            j = Math.floor(len / 8);            while(j){                j--;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;                array[templen--]+1;            }        }        console.timeEnd("device‘s device");    </script></html>

来看看执行后的结果,执行环境是 win7,chrome 版本 59.0.3071.86(正式版本) (64 位)

技术分享

可以看到for-in所花的时间最长,而device‘s时间最短,对于少量的数据,比如在1000次以下差别不会很大

总结

1、总体来说for循环和for-each性能相当,在小数据量时也与while性能相当。for-in性能最差,duff‘s device性能最好。大数据量时,while性能优于for循环和for-each循环。

2、对于数据量不大的循环(<1000),不用考虑使用哪一种性能更好,可读性是第一位。

3、对于有较大数据量的循环和遍历,如果性能不是瓶颈,那么普通的for循环(或者while,do-while,for-each)就可以了,毕竟可读性强。

4、对于较大的数据量,如果array的循环操作已经成为瓶颈,或者性能非常重要,那么可以采用duff‘s device方案。

5、任何时候都不建议使用for-in,除非必须要用。

JavaScript 循环性能比较