Computing

Object Oriented JavaScript

10. Associative Array Notation

From Stephen Chapman, former About.com Guide

See More About

So far in looking at how to reference the properties and methods of an object we have used dot notation - object.property and object.method(). There is an alternative way of referencing the properties and methods which makes referencing properties and methods even more flexible and this is to use the alternative associate array notation instead of dot notation.

Instead of object.property we would use object['property'] and instead of object.method() we would use object['method'](). Why would we want to do this though since it just adds three extra characters to what we need to type in making the reference?

Well the difference that it makes is that it moves the name of the property or method from being a part of the field name to being a value being passed to an array. As an array value we can substitute a variable for the literal and thus be able to reference different properties or methods of the object based on the value of a completely separate field. Here's a simple example to illustrate this.


myobj.prototype.getProp = function(propname) {
return this[propname];
}

This is a rather useless method by itself (obviously in real use there'd be a lot more code involved) but it does illustrate the power of the associative array notation when used with objects. In this case the method is going to return the value of one of the properties of the current object but which of the properties that gets returned depends on the value of the parameter passed to the method.

One area where this comes in particularly useful is where you want to be able to process all of the properties and methods of an object where you don't even know what all their names are. You can simply use the for/in loop that works with any associative array to read all of the properties and methods one after the other and process them. There is one slight complexity to this though and that is that JavaScript applies an internal attribute called DontEnum to some of the properties and methids that always exist for all objects (such as constructor) and a for/in loop will therefore not retrieve those properties. This is probably what you would expect to happen anyway since if you were to retrieve the constructor property of an object in such a loop then you open up all sorts of other complexities in the processing involving the parent, grand parent etc objects of the one you are enumerating (as such a for/in loop is called).

One way of determining which properties and methods are only accessible when accessed directly and which can be accessed in a for/in loop is to use another of the methods that all objects inherit from the Object object and that method is propertyIsEnumerable which of course itself has DontEnum set. There is one slight issue with using this and the for/in loop though with respect to JScript (it works fine in JavaScript) and that is that JScript will skip over any property in any object where there is a same-named property in the object's prototype chain that has the DontEnum attribute rather than just examining the current object definition. This can lead to unexpected results where you override an inherited method with a new one. For example if your obhect defines its own toString method then JavaScript will include it when enumerating a for/in loop while JScript will not because the toString belonging to the Object object from which your object is derived has DontEnum set for that method name. This isn't a major problem though since it is only those few methods of the built in objects that havse DontEnum set that are affected by this incorrect implementation in JScript.

Object Oriented JavaScript

10. Associative Array Notation

All the Object Oriented JavaScript Tutorials