jQuery $.each() not working on object as expected

Question

I have the following object:

var objectVar = {
    4 : { "key" : "key-name4", "item4" : {} },
    3 : { "key" : "key-name3", "item3" : {} }
}

I then try the following:

$(objectVar).each(function(index,record){
    console.log(record); // Loops Only Once and Logs Full Object
});

Can anyone help me with why the $.each(); function inst iterating through the sub objects within the main object?

Any help would be appreciated!

Answer 1

"Can anyone help me with why the $.each(); function inst iterating through the sub objects within the main object?"

To loop the sub objects, you need sub loops.

While using the each()^[docs] method like you have will usually sometimes work (as it currently is), it is really meant for DOM elements.

Instead use the jQuery.each()^[docs] method:

$.each( objectVar, function(index,record){
    console.log(record); 

      // start a loop on the current record in the iteration
    $.each( record, function( index2, sub_record ) {
        console.log( index2, sub_record );
    });
});

Now your looping will be extended to the first level of nested objects.

If you're not sure of the overall structure, and want to enumerate the entire depth, you'll need to test each value encountered to see if it should be enumerated.