performance - javascript中forEach,map,for of的应用场景与效率？

问题描述

问 题

这裡讨论的是lodash版本的_.forEach和_.map，原生ES6 javascript的for of这三种方法。
目前我的使用思路是，如果是要遍历并改变Array并回传一个新的Array，那我就选择_.map。

至于for of 和_.forEach，我用了以下的方式测试效能:

forEach

let arr = [];
for(var i = 0 ; i<50000000 ; i++){
    arr.push(i);
}
var start = Date.now();
let sum = 0;
_.forEach(arr,(a)=>{
    sum += a;
});
var end = Date.now();
console.log('总数:'+sum,'毫秒数:'+(end-start));
//总数:1249999975000000 毫秒数:1530

for of

let arr = [];
for(var i = 0 ; i<50000000 ; i++){
  arr.push(i);
}
var start = Date.now();
let sum = 0;
for(let a of arr){
  sum += a;
}
var end = Date.now();
console.log('总数:'+sum,'毫秒数:'+(end-start));
//总数:1249999975000000 毫秒数:575

for of速度大胜_.forEach，所以在遍历Array时，我现在会使用for of而不是_.forEach。

我想问的是，这样的思路有问题吗？
_.forEach要在什麽时候使用呢？

我自己想到的_.forEach使用时机是遍历Object时，javascript原生的话应该是和for in比较。

解决方案

有问题。
JS中不存在传统意义上的数组，静态语言中，数组是一段连续的内存，每一个元素都是固定字节长度的，所以通过下标可以取地址，快速找到引用值。
但是JS中的数组是对象，这导致你遍历数组时，其实是在遍历对象的key(静态语言中的HashMap)，而JS中对数组类型的遍历做了特殊处理，所以foreach遍历不到非数值类型的键，这也解释了为什么foreach比forin慢，因为多了一层判断。
但是如果你使用forin遍历数组，会带出非数字键：

var x = [1, 2, 3];
x.a = 'a';
x.b = 'b';
x.c = 'c';
for (let k in x)
  console.log(k)

即使你不会这么干，谁知道你的同伴们呢？第三方框架中呢？自定义原型链呢？

结论：ES5中遍历数组还是老老实实的foreach或者for循环.
你的例子中使用的是ES6，由于Array类型实现了Iterator接口，所以forof是安全的，但是如果通过babel编译成es5，我猜想由于需要引入Iterator的pollyfill，效率不可能比foreach高。

这篇关于performance - javascript中forEach,map,for of的应用场景与效率？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！