Previous topic in this series: Inheritance without Classes

This is the eighth part of my tutorial on JavaScript. Focus of this series is to introduce developers who are comfortable with other programming languages like Java or C to the idiosyncrasies of JavaScript. Basic JavaScript knowledge is assumed, but is not necessary as the code samples are simple and self-explanatory. If you are new to JavaScript, I would suggest going through the topics below in the order given.

Topics:

1. A different beast
2. Types and Type Conversion
3. Functions
4. Scopes and Scope Chain
5. Closures
6. Objects without Classes
7. Inheritance without Classes
8. Array, Map and the for..in loop (You are here)
9. Literals and JSON
10. Meta-Programming, Exceptions and Module Pattern

This is probably the simplest topic in the whole series, but it is not without some thrills. Arrays and Maps are the most popular data-structures in any programming language. JavaScript provides Array as a first class language element, but for Maps it forces us to do a few neat tricks.

Arrays

Arrays are objects in JavaScript. Code below shows two different approaches for creating and using arrays.

 //Code- Array is an Object var evenNumbers = new Array(); evenNumbers.push(2); evenNumbers.push(4); evenNumbers.push(6); console.log(typeof(evenNumbers)); //object console.log(evenNumbers instanceof Array); //true var fruits = ['apple', 'banana', 'grapes']; //native, first class arrays console.log(typeof(fruits)); //object console.log(fruits instanceof Array); //true 

The Array object has a rich set of utility methods – foreach, map, filter etc. See this page for a complete reference.  Unfortunately, some of those methods are not cross-browser compatible. But those can be fixed by monkey patching the Array.prototype (we have seen how to do this in the end of topic-6). The same technique is often used to add even more utility methods to Arrays.

Note: Since arrays are objects, they are always passed by reference and not by value. See this for a sample code.

No multi-dimensional arrays: JavaScript does not have multi-dimensional arrays.  But,  each element of an Array can again be another Array. Code below shows how a two-dimensional array is simulated.

 var matrix = [ [ 1, 2, 3, 4 ], [ 5, 6, 6, 8], [ 9, 10, 11, 12 ] ]; console.log(matrix[2][2]); //11 console.log(matrix[0][3]); //4 

Maps

JavaScript does not have a Map (also known as associative array and as dictionary) datatype. However, objects themselves work like maps. Code below shows an object being used as map.

 //Code – Simulating Maps in JavaScript var director = {}; //or new Object(); director['ChinaTown'] = 'Polanski'; //entry in map OR property and value director['Unforgiven'] = 'Eastwood'; director['Bycycle Thief'] = 'DeSica'; director['Red Beard'] = 'Kurosawa'; console.log(director['ChinaTown']); //Polanski console.log(director['Red Beard']); //Kurosawa 

The astute reader can observe that, director is infact an object with some dynamically added properties. And value ‘lookup’ is infact simply getting the values for the properties.

We will see a full fledged practical, reusable Map implementation in the next page after understanding the for..in loop