在这些$ .each循环中，更快/更有效/更好的是什么？

Question

I have a Javascript object which looks like this:

var a = {
  b: [1,2,3,4,5,6,7,8,9],
  c: [10,11,12,13,14,15]
}

to loop through both arrays (I want to loop through every value!) I use $.each , but I can do this:

// Option A:
$.each(a, function(i, d){
  $.each(d, function(j, e){
    console.log(e);
  }
});

or this

// Option B:
$.each(a.b, function(k, f){
  console.log(f)
})

$.each(a.c, function(l, g){
  console.log(g)
})

Both generate exactly the same output, but which of these two versions is faster/more efficient/better?

Is there any difference at all?

Or is there a more faster/more efficient/better way (without $.each )?

Answer 1

The most efficient way is to use a simple and native for loop. Avoid jQuery at all.

Answer 2

Nothing can beat :

var i=0, arr=a.b, len=arr.length;   
for(; i<len; i++ ) { console.log(arr[i]) } ;

by the way, if you are in doubt, ask jsperf.
Here there's one test that shows a 5X / 10X increase :
http://jsperf.com/for-vs-foreach/9

Answer 3

It is not true that using some kind of each is always slower than a for loop. SM and V8 can do pretty good inlining as long as you are not ruining it for them - a custom implementation of each taking advantage of the fact can run just as fast as a for loop .

With that said, jQuery $.each doesn't take advantage of the fact and it is slow. Avoid in performance sensitive situations.

As for your question, I expect the second one to be slightly faster in JITs because it avoids reflection and uses static property access which is taken advantage of by every modern engine. $.each is so slow that the difference isn't really pronounced here.

http://jsperf.com/129031290419034

Answer 4

If your real concern is speed then go for javascript's own for loop. for your answer, I think Option b will be faster