65

In the example below, the array2.length is only 10, while in my mind, it should be 13.

Why does the "string keyed" indexes not increase the length of the array?

I can store things and still access it, and the VS debugger shows that those arrays are being stored properly. So why is the length not increased?

var array2 = new Array();
array2["a"] = new Array();
array2["b"] = new Array();
array2["c"] = new Array();
for (var i = 0; i < 10; ++i)
    array2[i] = new Array();

var nothing = "";
for (var i = 0; i < array2.length; ++i)
    nothing = "";
Alexander Abakumov
  • 13,617
  • 16
  • 88
  • 129
Dave
  • 2,506
  • 2
  • 20
  • 27
  • Possible duplicate http://stackoverflow.com/questions/5223/length-of-javascript-associative-array – scibuff Mar 02 '12 at 01:41
  • The [description of Array over at MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Description) (Mozilla Developer Network) tells you everything you need to know. – DJDaveMark May 14 '19 at 09:37

7 Answers7

138

Javascript arrays cannot have "string indexes". A Javascript Array is exclusively numerically indexed. When you set a "string index", you're setting a property of the object. These are equivalent:

array.a = 'foo';
array['a'] = 'foo';

Those properties are not part of the "data storage" of the array.

If you want "associative arrays", you need to use an object:

var obj = {};
obj['a'] = 'foo';

Maybe the simplest visualization is using the literal notation instead of new Array:

// numerically indexed Array
var array = ['foo', 'bar', 'baz'];

// associative Object
var dict = { foo : 42, bar : 'baz' };
deceze
  • 510,633
  • 85
  • 743
  • 889
  • 11
    Well, to be fair, the numeric indexes are also just properties of the object. Arrays work just fine if you use the string representation of the index instead of using a number: `var xs = [10, 20, 30]; console.log(xs['1']);` – hugomg Mar 02 '12 at 01:55
  • 7
    Well yes, that goes back to the fact that virtually everything in Javascript is an object is a function is an object and the `.` notation and the `[]` notation of accessing object properties are all the same really. Still, setting "string indexes" on an `Array` object is not using the array characteristics of the `Array` object. – deceze Mar 02 '12 at 01:58
  • 2
    Though it seem like array and object same but the difference lies in terms of Prototype methods that we get with array is not as same as object. We cant simply use methods like 'push' , 'unshift' etc. with objects . – shubhamkes Feb 17 '17 at 11:09
  • 2
    @deceze - your comment "setting 'string indexes' on an Array object is not using the array characteristics of the Array object" is misleading. Per the following example `var a = [0] /* a.length is 1 */; a['1'] = 1 /* a.length is now 2 */; a.push(2) /* 'a' now contains three elements 0, 1 and 2 at indices 0, 1 and 2 */` – aaaaaa Mar 02 '17 at 04:21
21

Because the length is defined to be one plus the largest numeric index in the array.

var xs = [];
xs[10] = 17;
console.log( xs.length ); //11

For this reason, you should only use arrays for storing things indexed by numbers, using plain objects instead if you want to use strings as keys. Also, as a sidenote, it is a better practice to use literals like [] or {} instead of new Array and new Object.

InSync
  • 4,851
  • 4
  • 8
  • 30
hugomg
  • 68,213
  • 24
  • 160
  • 246
12

You're not adding items to the array; you're adding properties to the Array object.

sje397
  • 41,293
  • 8
  • 87
  • 103
4

As said above, use object for associative arrays.

If you don't you won't necessarily notice you're doing it wrong, until you innocently use "length" as an array index :

var myArray = [];
myArray["foo"] = "bar"; //works
console.log(myArray["foo"]) //print "bar"
myArray["length"] = "baz" //crash with a "RangeError: Invalid array length"

That is because you are replacing the length attribute of an array with a String, which is invalid.

Antoine Banctel-Chevrel
  • 724
  • 1
  • 5
  • 7
3

"string keyed" indexes are not indexes at all, but properties. array2["a"] is the same as saying array2.a. Remember that you can set properties on any kind of variable in javascript, which is exactly what you're doing here.

bhamlin
  • 5,177
  • 1
  • 22
  • 17
  • You can't set properties on `null`, `undefined` :P. Also, some evil IE browser objects don't let you set or get custom properties on them. – hugomg Mar 02 '12 at 01:57
2

You can push object to array, it will automatically get indexed (integer). If you want to add index as you want then you want to make it as object

Piusha
  • 594
  • 5
  • 11
0

If you want to use an object's properties as if they were like instances of a string indexed array, the work around for the length is:

var myArray = new Array();
myArray["a"] = 'foo';
myArray["b"] = 'bar';
myArray["c"] = 'baz';

let theLength = Object.keys(myArray).length
ilketorun
  • 324
  • 3
  • 14