JavaScript - Why can I set keys in an Array?

Question

I thought I knew JavaScript pretty decently, until I encountered other developer's code which knocked me down:

var data = [];

As you can see by its name, it's supposed to be used as an associative array (i.e. Object), but it is an Array. And then he assigns values to keys of that array:

data['somekey'] = 'somevalue';

I thought that wasn't possible in JavaScript, I thought it would throw an exception, but it works. Why does it work? Why do we need Objects then, if we can use Arrays instead? Is it considered a bad practice, and should I shame that developer?

`Array` instances are Objects so you can set properties on them. But the properties you set do not get iterated over by normal means (`for of` loop, `Array.prototype.forEach`, etc) unless they are positive integer keys — Patrick Evans, May 16 '16 at 16:29
Everything is an object in javascript. The same way you can call an index from object using this sintaxe obj['item'] — Marvin Medeiros, May 16 '16 at 16:30
Somewhat related: [JavaScript associative array to JSON](http://stackoverflow.com/q/4425289/218196) — Felix Kling, May 16 '16 at 16:46
http://www.typescriptlang.org/play/index.html#src=var%20data%20%3D%20%5B%5D%3B%0D%0Adata%5B'pickles'%5D%20%3D%20%22loves%20'em%22%3B%0D%0Aalert(JSON.stringify(data.pickles))%3B%20 — David Pine, May 16 '16 at 17:02

score 5 · Answer 1 · answered May 16 '16 at 16:27

It works because Arrays are just a special case of Objects. In fact, check this out:

typeof []; // "object"

Arrays give developers additional methods such as push, pop, etc. and allows the internal engines to better optimize them based on the way they are used.

In general, it's better to use a normal object for associative arrays since that's essentially what objects are. There's no real reason to use arrays as "associative arrays" in that case. Likewise, JS engines generally optimize objects into a hashmap-like structure which may or may not happen if you try and use a normal array in the same manner.

score 0 · Answer 2 · answered May 16 '16 at 16:29

0

Almost all objects in javascript are derived from a hash object in some way or another. It's through this hash that objects like arrays, store their own internal properties and also allow them to be extended and overridden.

For instance, all of the following evaluate to "object":

typeof(null)
typeof([])
typeof({})
typeof(function(){}.prototype)
typeof(new function(){})

answered May 16 '16 at 16:29

Anthony E

11,072
2
24
44

Well, `typeof null` only returns "object" because the algorithm says "if the value is null, return 'object'". – Felix Kling May 16 '16 at 16:45

score 0 · Answer 3 · answered May 16 '16 at 16:40

Internally, JavaScript has only objects (and primitive types). Objects are unordered collection of key:value pairs, where key is string and value can be any JavaScript type.

Arrays, though on the outside look like normal arrays of any other language, are actually a special case of objects, with natively supported language syntax.

>typeof []
 "object" 

>Object.prototype.toString.call([]) 
"[object Array]"

score 0 · Answer 4 · answered May 16 '16 at 16:44

Arrays are Objects with some added abilities made specifically to make it easier to use numeric keys in a list-like fashion. So yes, you can assign properties to them like a normal object as well. Those abilities are retained.

As for why you need objects then...because without objects there wouldn't be javascript. Most things in JS are Objects. That's precisely what you're figuring out by noticing you can treat Arrays like Objects. It's a bit backwards to conclude from that that Objects aren't needed when what you're discovering is that they are the base of most things in JS!

score 0 · Answer 5 · answered May 16 '16 at 17:06

0

In JavaScript everything is really just key value pairs, take a look @ this -- where I threw together a quick example and hit the Run button towards the upper-right hand corner.

answered May 16 '16 at 17:06

David Pine

23,787
10
79
107

score -1 · Answer 6 · answered May 16 '16 at 16:48

-1

As everybody knows everything in JS are objects which are key : value pairs. Arrays are also objects internally.

var arr = ["this","is","array"];

when define this in JS, Internally it will be defined like an object with key as index.

arr = {0 : "this", 1 : "is", 2 : "array"}.

Also Array is a class which is wrapped over Object class and it has additional methods to access the values.

hope this helps you.

answered May 16 '16 at 16:48

Bkjain655

200
6

"everything in JS are objects which are key : value pairs" : no. Some values aren't objects. And no, internally arrays aren't wrapper over objects (not in any of the common JS engines). – Denys Séguret May 16 '16 at 16:56
If we check the prototype chain then the final class from which it will be inherited from will be Object class. Isn't that true. var aa = []; aa.__proto__.__proto__ = Object class?? "Some values aren't objects" -> can you please elaborate little on this? – Bkjain655 May 16 '16 at 17:06
"3" and NaN are JS values but not objects. As for the internals, any JS engine use optimized arrays for dense arrays (and some of them even use typed arrays like arrays of short integers when the optimization is possible). – Denys Séguret May 16 '16 at 17:43

JavaScript - Why can I set keys in an Array?

6 Answers6