Arrays keys number and "number" are unexpectedly considered the same

Question

I have been playing with javascript arrays and I have run into, what I feel, are some inconsistencies, I hope someone can explain them for me.

Lets start with this:

var myArray = [1, 2, 3, 4, 5];
document.write("Length: " + myArray.length + "<br />");
for( var i in myArray){
   document.write( "myArray[" + i + "] = " + myArray[i] + "<br />");
}
document.write(myArray.join(", ") + "<br /><br />");

Length: 5
myArray[0] = 1
myArray[1] = 2
myArray[2] = 3
myArray[3] = 4
myArray[4] = 5
1, 2, 3, 4, 5

There is nothing special about this code, but I understand that a javascript array is an object, so properities may be add to the array, the way these properities are added to an array seems inconsistent to me.

Before continuing, let me note how string values are to be converted to number values in javascript.

• Nonempty string -> Numeric value of string or NaN

• Empty string -> 0

So since a javascript array is an object the following is legal:

myArray["someThing"] = "someThing";
myArray[""] = "Empty String";
myArray["4"] = "four";

for( var i in myArray){
   document.write( "myArray[" + i + "] = " + myArray[i] + "<br />");
}
document.write(myArray.join(", ") + "<br /><br />");

Length: 5
myArray[0] = 1
myArray[1] = 2
myArray[2] = 3
myArray[3] = 4
myArray[4] = four
myArray[someThing] = someThing
myArray[] = Empty String
1, 2, 3, 4, four

The output is unexpected.

The non empty string "4" is converted into its numeric value when setting the property myArray["4"], this seems right. However the empty string "" is not converted into its numeric value, 0, it is treated as an empty string. Also the non empty string "something" is not converted to its numeric value, NaN, it is treated as a string. So which is it? is the statement inside myArray[] in numeric or string context?

Also, why are the two, non numeric, properities of myArray not included in myArray.length and myArray.join(", ")?

Answer 1

The keys of a JavaScript array are actually strings. For details and an implementation of a map type for arbitrary keys, check this answer.

---

To clarify and add to what Jason posted: JavaScript arrays are objects. Objects have properties. A property name is a string value. Therefore, array indices are converted to strings as well before anything more can happen. A property name P will be treated as an array index (ie the special array-magic will be invoked) if the following holds (ECMA-262, 15.4):

ToString(ToUint32(P)) is equal to P and ToUint32(P) is not equal to 2^32 − 1

That numeric indices will be converted to strings (and not the other way around) can be easily verified:

var array = [];
array[1] = 'foo';
array['1'] = 'bar';
array['+1'] = 'baz';
document.writeln(array[1]); // outputs bar

---

Also, its bad practice to iterate over an array's entries with a for..in loop - you might get unexpected results if someone messed with some prototypes (and it's not really fast, either). Use the standard for(var i= 0; i < array.length; ++i) instead.

Answer 2

(edit: the following is not quite right)

The keys of a JavaScript Object are actually strings. A Javascript Array by itself has numeric indices. If you store something with an index that can be interpreted as a nonnegative integer, it will try to do so. If you store something with an index that is not a nonnegative integer (e.g. it's alphanumeric, negative, or a floating-point number with a fractional piece), it will fail on the array-index store, and default to the Object (which is Array's base class) store, which then converts the argument to a string and stores by string index -- but these stored properties are not seen by the Array class and therefore are not visible to its methods/properties (length, join, slice, splice, push, pop, etc).

edit: the above is not quite right (as Christopher's foo/bar/baz example shows). The actual storage indices according to the ECMAscript spec are, in fact, strings, but if they are valid array indices (nonnegative integers) then the Array object's [[Put]] method, which is special, makes those particular values visible to the Array's "array-ish" methods.