Why can I add named properties to an array as if i

问题:

The following two different code snippets seem equivalent to me:

var myArray = Array();
myArray[\'A\'] = \"Athens\";
myArray[\'B\'] = \"Berlin\";

and

var myObject = {\'A\': \'Athens\', \'B\':\'Berlin\'};

because they both behave the same, and also typeof(myArray) == typeof(myObjects) (both yield \'object\').

Is there any difference between these variants?

回答1:

Virtually everything in javascript is an object, so you can \"abuse\" an Array object by setting arbitrary properties on it. This should be considered harmful though. Arrays are for numerically indexed data - for non-numeric keys, use an Object.

Here\'s a more concrete example why non-numeric keys don\'t \"fit\" an Array:

var myArray = Array();
myArray[\'A\'] = \"Athens\";
myArray[\'B\'] = \"Berlin\";

alert(myArray.length);

This won\'t display \'2\', but \'0\' - effectively, no elements have been added to the array, just some new properties added to the array object.

回答2:

In JS arrays are objects, just slightly modified (with a few more functions).

Functions like:

concat
every   
filer
forEach
join
indexOf
lastIndexOf
map
pop
push
reverse
shift
slice
some
sort
splice
toSource
toString
unshift
valueOf 

回答3:

Everything in JavaScript is an object besides primitive types.

The code

var myArray = Array();

creates an instance of the Array object while

var myObject = {\'A\': \'Athens\', \'B\':\'Berlin\'};

creates an instance of Object object.

Try the following code

alert(myArray.constructor)
alert(myObject.constructor)

So you will see the difference is in the type of object constructor.

The instance of the Array object will contain all the properties and methods of the Array prototype.

回答4:

Me thinks, me too metaphorical and cryptic with previous answer. Clarification follows.

An instance of Array, Boolean, Date, Function, Number, RegExp, String is an Object but enhanced with methods and properties specific to each type. For example, an array has a predefined length property while generic objects do not.

javascript:alert([].length+\'\\n\'+{}.length)

displays

0
undefined

Intrinsically, the FF Gecko interpreter also distinguishes between Arrays and generic Objects with distinct differences evaluating language constructs.

javascript:
  ra=[  \"one\",   \"two\",   \"three\"]; ra.a=4;
  ob={0:\"one\", 1:\"two\", 2:\"three\"}; ob.a=4;
  alert(
    ra            +\"\\n\\n\"+
    ob            +\"\\n\\n\"+
    ra.toSource() +\"\\n\\n\"+
    ra.a          +\"\\t .toSource() forgot me! \\n\\n\"+
    ra.length     +\"\\t and my length! \\n\\n\"+
    ob.toSource());
  ps=\"\"; for(i in ra)ps+=i+\" \"; alert(ps);  /* NB .length is missing! */
  ps=\"\"; for(i in ob)ps+=i+\" \"; alert(ps);

displaying

one,two,three

[object Object]

[\"one\", \"two\", \"three\"]

4    .toSource() forgot me! 

3    and my length! 

({0:\"one\", 1:\"two\", 2:\"three\", a:4})

and 0 1 2 a and 0 1 2 a.

Regarding the statement that all objects are functions:

It is neither syntactically nor semantically correct to use an arbitrary object instance as a function like 123() or \"abc\"() or []() or {}() or obj() where obj is any type other than Function, so an arbitrary object INSTANCE is not a Function. However, given an object obj and it\'s type as Array, Boolean, Date, ..., how did obj come to be as an Array, Boolean, Date, ...? What is an Array, Boolean, Date, ...?

javascript:
    alert([Array, Boolean, Date, Function, 
              Number, Object, RegExp, String] . join(\'\\n\\n\') );

displays

function Array() {
    [native code]
}

function Boolean() {
    [native code]
}

function Date() {
    [native code]
}

function Function() {
    [native code]
}

function Number() {
    [native code]
}

function Object() {
    [native code]
}

function RegExp() {
    [native code]
}

function String() {
    [native code]
}

In every case, without equivocation, the object type manifests as a function definition, hence the statement that all objects are functions! (The tongue-in-cheek is that I intentionally obscured and blurred the distinction of an object instance with that of it\'s type! Still, this shows \"you can\'t have one without the other\", Object and Function! Capitalization emphasizes type as opposed to instance.)

Both a functional and object paradigm seem to be fundamental to the programming and implementing of the JS interpreter low level built-in primitives, such as Math and JSON and true.

 javascript:alert([Math, JSON, true.toSource()].join(\"\\n\\n\"));

displays

[object Math]

[object JSON]

(new Boolean(true))

---

At the time of the development of Javascript, an object-centric programming style (OOP\'s - Object Oriented Programming style - the \"\'s\" is my own pun!) was in vogue and the interpreter was similarly christened with Java to give it greater credibility. Functional programming techniques were relegated to more abstract and esoteric examinations studying the theories of Automata, Recursive Functions, Formal Languages, etc. and as such not as palatable. However, the strengths of these formal considerations are clearly manifest in Javascript particularly as implemented in FF\'s Gecko engine (ie. .toSource()).

---

The Object definition for Function is particularly satisfying for it is defined as a recurrence relation! defined using it\'s own definition!

function Function() { [native code] }
and since a function is an Object the same sentiment holds for
function Object() { [native code] }.

Most of the other definitions quiesce to a static terminal value. However, eval() is a particularly powerful primitive and so a String can also embed arbitrary functionality.

Note again, the vernacular used above obscures object type and instance distinction.

回答5:

One practical difference is when using JSON.stringify on an array all non-numeric indexes are ignored:

var arr = [];
var obj = {};

arr[\'name\'] = \'John\';
obj[\'name\'] = \'John\';

console.log(arr);    // will output [name: \"John\"]
console.log(obj);    // will output {name: \"John\"}

JSON.stringify(arr); // will return []
JSON.stringify(obj); // will return {\"name\":\"John\"}

回答6:

The difference between the arrays and the other objects in JavaScript. While arrays have a magically updating length property, for objects other than the arrays there is no way to implement such a property.

var arrName = [];
arrName[5] = \"test\";
arrName.length; // <- 6

Array are used to store things with an ordinal index - use it like a traditional array, stack, or queue. An object is a hash - use it for data that has a distinct key.

回答7:

The {}-notation is just syntactical sugar to make the code nicer ;-)

JavaScript has many similar constructs like the construction of functions, where function() is just a synonym for

var Func = new Function(\"<params>\", \"<code>\");