JavaScript Data Structures - Associative Array
Written by Ian Elliot   
Monday, 08 August 2011
Article Index
JavaScript Data Structures - Associative Array
Integer keys

The function evaluation operator

To evaluate a function you use the () operator:

functionobject()

which executes the functionobject to its left and evaluates to the result that the function returns.

For example:

method();

which produces:

 

alert3

 

Notice that you can apply the () operator to a function object no matter how you choose to retrieve it so you can use the property notation to make it look like an object method:

array.key2();

or you can use array notation which makes the method call look very odd:

array['key2']();

It doesn't matter how odd it looks as the () operator always evaluates the function object to its left and returns the result of the function as its value.

So with just a versatile associative array, a function object and the function evaluation operator () JavaScript implements objects. If you reflect on this for a moment you might agree that this is remarkable and elegant.

 

Banner

 

Integer keys

Now we need to look at the special case of integer keys. As an alternative to string keys you can use integer keys but if you do use a string key you cannot refer to the value using its ordinal position in the array. For example if you define the array as:

array={'key1': 'value1',
'key2':function(){alert("HelloMethod");}};

You cannot refer to key1 using array[0] or key2 as array[1]. This might seem obvious but notice that with JavaScript arrays provided by the DOM you can use either the key or the ordinal position. For example

document.forms[1];

or

document.forms['myform'];

both work and return the same object as long as myform is the second form in the array. It is important to notice that this dual indexing doesn't work for general JavaScript associative arrays.

When you use an integer key in an associative array it works just like a string or identifier key - as long as you use array and not property syntax. In fact JavaScript converts the integers to an equivalent string value.

That is if you define:

array={0: 'value1',
1:function(){alert("HelloMethod");}};

you can retrieve the function using

array[1]; 

or

array["1"]

but not

array.1;

and not

array."1";

So apart from not being able to use property syntax integer keys are no different. However they look as if they should be different. In particular an associative array with integer keys looks like a standard indexed array - but it isn't. For example, if we redefine array:

array={235: 'value1',
64:function(){alert("HelloMethod");}};

then you can call the function using:

array[64]();

Only the array elements you define are created in an associative array and so in this case array has just two members - array[235] and array[64]. This is efficient if you only want to use these two elements but JavaScript also provides the Array object which is optimized for storing indexed arrays and has lots of additional methods for working with indexed arrays. As it derives from Object it also can be used as an associative array but in this case the associative storage and the integer storage are handled in different ways. You can use an Array as an associative array but it really isn't a good idea because you are then incurring an overhead you aren't using and it can become very confusing having and indexed store and an associative store. 

If you want to use an associative array use an Object.

If you want to use an indexed array use Array.

That is don't use

array=Array();
array["key1"]=value1;

but use

array=Object();
array["key1"]=value1;

This isn't to say that the JavaScript Array isn't useful - it is a very powerful data structure and one we need to take a look at in a future data structures article.

 

This is one of a series of articles on implementing data structures in JavaScript.

See also:

See also:

 

 

Banner


Just JavaScript - In The Beginning Was The Object

JavaScript is a very subtle and sophisticated language and it deserves to be treated in its own right and not as a poor copy of other object-oriented language. In this first chapter of Just JavaScript [ ... ]



Javascript Jems - Lambda expressions

JavaScript has lambda expressions in all but name. Find out how they work and how to use them.


Other Articles

<ASIN:0137054890>

<ASIN:0596517742>

<ASIN:1590597273>

<ASIN:0596805527>

 



Last Updated ( Tuesday, 15 January 2013 )
 
 

   
RSS feed of all content
I Programmer - full contents
Copyright © 2014 i-programmer.info. All Rights Reserved.
Joomla! is Free Software released under the GNU/GPL License.