JQuery map vs Javascript map vs For-loop

Question

我正在实现一些自然适合地图的代码。 但是，我在列表中有大量的对象，我将要迭代，所以我的问题是哪个是最好的方法：

var stuff = $.map(listOfMyObjects, someFunction())

var stuff = listOfMyObjects.map(someFunction())

要不就

var stuff = new Array(); 
for(var i = 0; i < listOfmyObjects.length; i++){
    stuff.push(someFunction(listOfMyObjects[i]));
}

Answer 1

后者（for循环）要快得多。 我记得在某个地方看到了一个基准，但我似乎无法找到这个链接。

如果性能确实是一个问题，那么我会使用for循环。 它并没有真正模糊代码。

Answer 2

这是在jsben.ch中完成的测试用例： http ：//jsben.ch/#/BQhED

它表明for循环映射比jquery映射更快（至少在chrome中）。

Answer 3

首先，真正的Objects没有本机.map()方法，也没有.length属性。 所以我们要么谈论Arrays ，要么是Array-like-objects （例如jQuery对象）。

但是，没有比使用native for ， while或do-while循环更快的迭代方法。 所有其他功能操作都会为每次迭代执行一个函数（猜测是什么）。

当一个对象传递给它时，jQuerys的.each()只会执行一个for-in循环。 这是循环对象的最快方法。 您可以自己使用for-in并节省开销呼叫。

可读性方面的另一个“好”方法是使用.keys()和.map()等ES5功能。 例如：

var myObj = {
    foo:  'bar',
    base:  'ball',
    answer: 42,
    illuminati: 23
};

Object.keys( myObj ).map(function( prop ) {
    console.log( myObj[ prop ] );
});

我认为这在可读性，便利性和性能方面是一个非常好的交易。 当然你应该为旧的浏览器使用ES5抽象库。

但同样，在性能方面无法击败原生循环。

Answer 4

为Emil的“测试它”答案+1：这总是正确的答案。

但是，原生循环获胜，你可以通过缓存长度来做得更好，这样每次迭代都不会评估.length引用。

for(var i = 0, l = list.length; i < l; i++)

或者通过倒退来避免额外的变化

for(var i = list.length-1; i >= 0; i--)

并且，如果你可以'内联''someFunction'，那将会更快。 基本上，尽可能避免函数调用和引用。 但这只是在你真正关注细节的时候。 像这样的优化不太可能很重要。 总是测试找到你的瓶颈。

Answer 5

使用jsperf中的 html / javascript代码创建测试用例。

您将能够看到哪种方法效果最好，以及不同浏览器执行循环的速度有多快。

我会把钱花在本机JavaScript循环上，但你永远不会知道。