JQuery from $.each to for loop

Question

I am very new to JQuery, from examples I have managed to create loop, I know it`s simple question but I need your help. How can I convert $.each loop:

$.getJSON('db.json', function(data) 
 {
   $.each(data, function(key, val) 
    {

        if(typeof val === 'object') 
        {
            checkObj(key, val, items);
        } 

    });
}

to for loop? I have tried:

for (var i=0; i< data.length; i++)
    {

        if(typeof val === 'object') 
        {
            checkObj(key, val, items);
        } 

    }

but what to do with key and val?

The source code for $.each is very short and pretty readable. It is open source and you could just copy out the loop you need and try to get it to work. To look see the first answer to stackoverflow.com/questions/1883611/should-i-use-jquery-each — Paul
– Paul, Commented Aug 11, 2013 at 9:17
If the top code section is correct, and it might not be, then items is defined in previous code, or perhaps undefined. It is not defined in the $.getJSON or the $.each callbacks, which only identify data, key, and val — Paul
– Paul, Commented Aug 11, 2013 at 9:21

T.J. Crowder · Accepted Answer · 2013-08-11 09:11:22Z

7

You're very close (for arrays). Just add:

var val;

at the top and then

val = data[i];

in the loop.

var i, val;
for (i=0; i< data.length; i++)
{
    val = data[i];
    if(typeof val === 'object') 
    {
        checkObj(i, val, items);
        //       ^----- `i`, not `key`, since you used `i` instead of `key` for the loop
    } 

}

But my question would be: Why do that? $.each is very handy, not least because it provides this nice contained scope for the key/i and val variables. If you're worried about making a function call on each iteration, don't be.

$.each also has a dual-nature: When you're giving it an array, it loops through the array elements. But when you give it an object, it loops through the enumerable properties of the object. Both are quite handy.

answered Aug 11, 2013 at 9:11

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Nicklas Nygren Over a year ago

One advantage that for has over $.each is somewhat better performance.

Felix Kling Over a year ago

@Nicklas: T.J. addressed this with the sentence "If you're worried about making a function call on each iteration, don't be." Though there will be an additional overhead when using $.each, not only the function call.

Esailija Over a year ago

It's possible to make an .each implementation that performs the same as a for loop (at least in V8 and SpiderMonkey due to implementing inlining optimization). jQuery $.each however performs like a dog, avoid when performance is a concern.

T.J. Crowder Over a year ago

Yeah. The issue with $.each (and forEach to an extent) is it tries to be all-singing, all-dancing. If you don't need thisArg (and you almost never do) and you aren't dealing with sparse arrays, you can dramatically improve performance. Great perf test, btw. For completeness, I've added "own" and "in" tests, which absolutely kill the performance: jsperf.com/for-foreach-jqeach/5 (I also added checks that each loop actually did work; always best to have those checks in there).

Felix Kling Over a year ago

Yes, .hasOwnProperty and in drastically decrease performance. typeof ... !== 'undefined' is a much more efficient existence test (though of course not completely equivalent, but probably sufficient in most cases). See jsperf.com/hasownproperty-vs-in/2.

|

Collectives™ on Stack Overflow

JQuery from $.each to for loop

1 Answer 1

7 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related