Array vs. Object efficiency in JavaScript

by

The short version: Arrays are mostly faster than objects. But there is no 100% correct solution.

Update 2017 – Test and Results

var a1 = [{id: 29938, name: 'name1'}, {id: 32994, name: 'name1'}];

var a2 = [];
a2[29938] = {id: 29938, name: 'name1'};
a2[32994] = {id: 32994, name: 'name1'};

var o = {};
o['29938'] = {id: 29938, name: 'name1'};
o['32994'] = {id: 32994, name: 'name1'};

for (var f = 0; f < 2000; f++) {
    var newNo = Math.floor(Math.random()*60000+10000);
    if (!o[newNo.toString()]) o[newNo.toString()] = {id: newNo, name: 'test'};
    if (!a2[newNo]) a2[newNo] = {id: newNo, name: 'test' };
    a1.push({id: newNo, name: 'test'});
}

test setup
test results

Original Post – Explanation

There are some misconceptions in your question.

There are no associative arrays in Javascript. Only Arrays and Objects.

These are arrays:

var a1 = [1, 2, 3];
var a2 = ["a", "b", "c"];
var a3 = [];
a3[0] = "a";
a3[1] = "b";
a3[2] = "c";

This is an array, too:

var a3 = [];
a3[29938] = "a";
a3[32994] = "b";

It’s basically an array with holes in it, because every array does have continous indexing. It’s slower than arrays without holes. But iterating manually through the array is even slower (mostly).

This is an object:

var a3 = {};
a3[29938] = "a";
a3[32994] = "b";

Here is a performance test of three possibilities:

Lookup Array vs Holey Array vs Object Performance Test

An excellent read about these topics at Smashing Magazine: Writing fast memory efficient JavaScript

More Related Contents:

  1. Convert JSON to array in Javascript
  2. Defining methods via prototype vs using this in the constructor – really a performance difference?
  3. What’s the best way to convert a number to a string in JavaScript?
  4. Declaring multiple variables in JavaScript
  5. When does reflow happen in a DOM environment?
  6. Controlling fps with requestAnimationFrame?
  7. regex.test V.S. string.match to know if a string matches a regular expression
  8. Should CSS always precede Javascript?
  9. Javascript when to use prototypes
  10. Does use of anonymous functions affect performance?
  11. How to avoid freezing the browser when doing long-running computations in Javascript
  12. Why is bind slower than a closure?
  13. Is there a performance difference between ‘let’ and ‘var’ in JavaScript
  14. v8 JavaScript performance implications of const, let, and var?
  15. Efficient Javascript String Replacement
  16. Object.keys() complexity?
  17. JavaScript performance difference between double equals (==) and triple equals (===)
  18. Are JavaScript Arrays actually implemented as arrays?
  19. Best way to execute js only on specific page
  20. Why Array.forEach is slower than for() loop in Javascript? [duplicate]
  21. Does the tag position in HTML affects performance of the webpage?
  22. setTimeout() with string or (anonymous) function reference? speedwise [closed]
  23. Are ES6 template literals faster than string concatenation?
  24. Javascript (jQuery) performance measurement and best practices (not load time)
  25. How browser executes Javascript and renders asynchronously
  26. Javascript – insert an array inside another array
  27. Extending String.prototype performance shows that function calls are 10x faster
  28. visibility:hidden vs display:none vs opacity:0
  29. Does using a document fragment really improve performance?
  30. value of using React.forwardRef vs custom ref prop

Leave a Comment