jquery每個與原生的

Question

var arr=[];
var k;
for(var i=0;i<5000;i++)
 arr[i]=i;

console.time("native loop");
var len=arr.length;
for(var j=0;j<len;j++)
 k=arr[j];
console.timeEnd("native loop");

console.time("jq loop");
$(arr).each(function(i,el){
 k=el;
});
console.timeEnd("jq loop");

它正在生成，14ms用於本機循環，3ms用於Jquery。

我正在使用Jquery 1.6.2。 如果Jquery在場景后面使用原生循環，那么怎么可能呢？

Answer 1

我認為它與索引變量的范圍有關 - 你的j變量是全局變量，這是變量訪問的最慢情況。 每次循環必須引用j時，它需要檢查作用域鏈的所有方向，返回全局對象，然后從那里獲取變量值。

我在我的控制台中得到了類似的數字（Chrome，OS X - for循環的13-15ms，jQuery的3-4ms）。

但是，如果我這樣做：

(function() {
    console.time("native loop with function scope");
    var len=arr.length;
    for(var j=0;j++<len;)
        k=arr[j];
    console.timeEnd("native loop with function scope");})()

它只需5ms即可執行。

這種情況的不同之處在於j是一個函數局部變量，可以在JavaScript引擎查找變量的第一個位置立即使用。 len同樣是本地的; 在這種情況下唯一的全局變量是k和arr 。

為了獲得更高的速度，請使用ka函數范圍變量，並將arr作為參數傳入：

(function(arr) {
    console.time("native loop 2");
    var len=arr.length, k;
    for(var j=0;j++<len;)
        k=arr[j];
    console.timeEnd("native loop 2");})(arr)

> native loop 2: 0ms

嗯，現在有點太快了。 也許arr應該更大：

var arr=[];
for(var i=0;i<50000;i++)
    arr[i]=i;

[Try again...]
> native loop 2: 1ms

這減慢了一點。

使用500k元素陣列，此代碼在我的機器上的JavaScript控制台中運行4ms。 在5M，需要36ms。

您還應該注意，您沒有使用原始jQuery.each（）調用 - 您首先將數組包裝在$（）中，創建一個jQuery對象，然后在其上調用.each。 更公平的測試可能是運行

$.each(arr, function(i,el){
    k=el;
});

這應該非常接近上面第二個例子的時間。 jQuery增加了一些開銷; 檢查其參數的類型，但之后它運行一個非常緊湊的循環。

Answer 2

檢查一下： http ： //jquery-howto.blogspot.com/2009/06/javascript-for-loop-vs-jquery-each.html

Answer 3

http://www.georgepaterson.com/2011/08/30/javascript-performance-jquery-each-and-each-versus-alternatives/ jQuery.each旨在迭代數組和數組對象。
與您的Question.see鏈接相反的結果
http://jsfiddle.net/martinaglv/NcRsV/