【性能优化】探究各类数组方法遍历性能，以及与Oject检索速率比较

最新推荐文章于 2024-01-12 10:25:41 发布

原创

最新推荐文章于 2024-01-12 10:25:41 发布 · 840 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#filter #map #javascript #前端 #es6

前言：JavaScript中存在许多遍历数组的方法，如for in，forEach，map，filter等，以及ES6新增的for of方法。每个项目经常会出现频繁的遍历数组的场景，且JavaScript的执行是单线程的，所以对于性能的探究，就显得很有必要了。

一、遍历数组

①、长度较小数组

let arr = [];
for(let i = 1; i<= 100; i++){
    arr.push(i);
}

console.time('for in');
for (let index in arr) {}
console.timeEnd('for in');

console.time('forEach');
arr.forEach((item)=>{});
console.timeEnd('forEach');

console.time('for of');
for (let item of arr) {}
console.timeEnd('for of');

每次的结果会有些不一样，取十次的平均值

会发现执行速率上并没有太大的区别。但for of跟forEach，还是会相对优于for in循环

②、长度较大数组

let arr = [];
for(let i = 1; i<= 1000000; i++){
    arr.push(i);
}

console.time('for in');
for (let index in arr) {}
console.timeEnd('for in');

console.time('forEach');
arr.forEach((item)=>{});
console.timeEnd('forEach');

console.time('for of');
for (let item of arr) {}
console.timeEnd('for of');

同样，取十次的平均值</