遍历js数组和性能分析的八种方法（带代码）

JS数组遍历基本上是forjs遍历字符串数组，forin，foreach，forofjs遍历字符串数组，map等方法. 下面介绍了本分析中使用的几种数组遍历方法以及性能分析的比较

代码如下:

for(j = 0; j < arr.length; j++) {
   
}

简要说明:

最简单的也是最常用的一种. 尽管性能并不弱，但仍有优化的空间

代码如下:

for(j = 0,len=arr.length; j < len; j++) {
   
}

简要说明:

使用临时变量缓存长度，避免重复获取数组的长度，当数组较大时，优化效果更加明显.

此方法基本上是所有循环遍历方法中性能最高的

代码如下:

for(j = 0; arr[j]!=null; j++) {
   
}

简要说明:

实际上，此方法严格来说是for循环，但它不使用长度判断，而是使用变量本身来判断

实际上，这种方法的性能远不如普通的for循环

代码如下:

arr.forEach(function(e){  
   
});

简要说明:

数组附带的foreach循环使用频率更高，实际上它的性能比普通的for循环弱

代码如下:

Array.prototype.forEach.call(arr,function(el){  
   
});

简要说明:

由于foreach带有Array类型，对于某些非此类型的类型，它不能直接使用（例如NodeList），因此仅此变体可用. 使用此变体可以使类似的数组具有foreach函数.

实际表现比普通foreach弱

代码如下:

for(j in arr) {
   
}

简要说明:

这个循环被很使用，但是实际上，经过分析和测试之后，许多循环遍历方法都可以使用

效率最低

代码如下:

arr.map(function(n){  
   
});

简要说明:

此方法也被广泛使用. 尽管使用起来更优雅，但实际效率不如foreach

代码如下:

for(let value of arr) {  
   
});

简要说明:

此方法在es6中使用，性能优于forin，但仍不如普通的for循环

上面列举的几种方法一一进行了比较分析，基本上可以得出以下结论:

普通的for循环最优雅

（PS: 以上所有代码只是一个空循环，没有内部执行代码被回收，仅分析了各个循环的时间）

下面的屏幕快照中的数据是在chrome（支持es6）中运行100次后的结论（每次运行10次，共10个循环，获得了分析结果）

可以看出，forin循环最慢. 优化的for循环最快

以下截图数据是在chrome中运行1000次后的结论（支持es6）（每次运行100次，共10个周期，获得了分析结果）

本文来自电脑杂谈，转载请注明本文网址：
https://www.pc-fly.com/a/jisuanjixue/article-192528-1.html