Speed of looping through an array vs. looping through an object

Question

I'm not sure if this has been asked already, if it has, let me know in the comments and I'll delete the question. What's faster, looping through an object or looping through an array? For instance, if I have two arrays that are the exact same length(required for the script to run properly, not gonna get into details), each position in one array is associated with a position in the other array. So it looks like this:

var array_variable = ["get_ped_bridges", "get_rail_bridges"];
var array_url = ["http://eg.com/rest/services/Nope/MapServer/1", "http://eg.com/rest/services/Nope/MapServer/2"];

for(var j = 0; j < array_variable.length; j++){
    console.log(array_variable[j], array_url[j]);
}

So as you can see, each url matches up to a position in the array_variable array. In an object, it would look something like this:

var object = {
    one: {
        variable: "get_ped_bridges",
        url: "http://eg.com/rest/services/Nope/MapServer/1"
    },
    two: {
        variable: "get_rail_bridges",
        url: "http://eg.com/rest/services/Nope/MapServer/2"
    }
}

So, if the lengths of both were substantially longer(the actual length would probably be around 20 positions), which loop would process faster?

Why not have an array *of objects* with those objects having a `variable` and a `url` property? It's rarely a good idea to have parallel arrays like that. — Matt Burland, Aug 03 '15 at 17:29
So `var array = [ { variable: "get_ped_bridges", url: "http://eg.com/rest/services/Nope/MapServer/1" }, { ...} ];` — Matt Burland, Aug 03 '15 at 17:30
"...substantially longer ... 20..." you need MUCH larger arrays to be worrying about performance. Hundreds of thousands at least and probably more like millions. Also arrays are "objects" in Javascript. — EvilZebra, Aug 03 '15 at 17:31
@MattBurland, I didn't think about that, good suggestion. Doing an array of arrays would probably be better as well. — , Aug 03 '15 at 17:37
@Evilzebra, Yeah, there's really not any noticable time difference between having 20 positions compared to two, but just in case they do get ridiculously large. — , Aug 03 '15 at 17:39
@JuanMendes I had no idea that site even existed, thank you for that link. — , Aug 03 '15 at 17:39

score 2 · Accepted Answer · edited May 23 '17 at 12:01

2

The short answer is that generally an array is faster.

This is because of continuos indexing in an array, where it is always exactly known where the next element is (because it's stored contiguously)

you can refer to this previous answer for more info: Array vs. Object efficiency in JavaScript

edited May 23 '17 at 12:01

Community

1
1

answered Aug 03 '15 at 17:38

curiousgeorge

232
1
6

1

Here is a test that you can run to see the efficiency difference: http://jsperf.com/performance-of-array-vs-object/3 – eddyjs Aug 03 '15 at 17:39

score 0 · Answer 2 · answered Aug 03 '15 at 17:37

<script src="http://broofa.com/Tools/JSLitmus/JSLitmus.js"></script>
<script>
JSLitmus.test('Array', function() {
    var array_variable = ["get_ped_bridges", "get_rail_bridges"];
    var array_url = ["http://eg.com/rest/services/Nope/MapServer/1", "http://eg.com/rest/services/Nope/MapServer/2"];

    for (var j = 0, len = array_variable.length; j < len; j++) {
        //
    }

    for (var j = 0, len = array_url.length; j < len; j++) {
        //
    }
});

JSLitmus.test('Object', function() {
    var object = {
        one: {
            variable: "get_ped_bridges",
            url: "http://eg.com/rest/services/Nope/MapServer/1"
        },
        two: {
            variable: "get_rail_bridges",
            url: "http://eg.com/rest/services/Nope/MapServer/2"
        }
    };

    for (var i in object) {
        //
    }
});
</script>

Speed of looping through an array vs. looping through an object

2 Answers2