The JavaScript Array: Dense, Parallel and Multidimensional

Dense Arrays
The previous lesson featured JavaScript array syntax known as simple, or long array notation. While very easy to read and understand, writing a lot of arrays in long notation can become tiresome. Arrays can also be written in shorthand, producing what is known as a dense array.

In the construction of a dense array, the array constructor and all the array's elements are contained on one line. Its elements are represented only by their data (no array name, brackets, or indices), and serve as parameters to the Array function. Each element is comma delimited, their indices now assumed chronologically.

var files = new Array("1st.htm", "2nd.htm", "3rd.htm", "4th.htm")

The elements of both long and dense arrays are accessed the same way:

document.write(myScripts[0]) // prints "documentWrite.html"
document.write(myScripts[3]) // prints "location.html"

Parallel Arrays
Parallel arrays are 2 or more arrays whose corresponding element indexes contain related information. An example of a parallel array could be an array holding the names of directories that contain the files stored in the myScripts array.

var myFolder = new Array()

myFolder[0] = "docWrite/"
myFolder[1] = "rollover/"
myFolder[2] = "functions/"
myFolder[3] = "location/"

var myScripts = new Array()

myScripts[0] = "documentWrite.html"
myScripts[1] = "simpleRollover.html"
myScripts[2] = "bgColorFunction.html"
myScripts[3] = "location.html"

The myFolder and myScripts arrays are parallel because their indices contain related information. Used together, the myFolder and myScripts arrays could be used to change the URL:

location.href = myFolder[2] + myScripts[2]

Multi-Dimensional Arrays
Multi-Dimensional Arrays are arrays whose elements are themselves arrays. You can build a multi-dimensional array as deep as you want, but they can be as unreadable and confusing as they are useful. Take a look at a piece of the multi-dimensional array used to generate the links on this site:

var week = new Array()

week[1]= new Array("TUTORIAL 1",
                   new Array("How To Use This Site",
                             new Array("Build A JavaScript Library","howto.html")
                             ),
                   new Array("Introduction to JavaScript",
                             new Array("How to Learn JavaScript","jsIntro1.html"),
                             new Array("Objects, Properties and Methods","jsIntro2.html"),
                             new Array("Two Parts to Scripting, The Dot Syntax","jsIntro3.html")
                             )

                  )

A simple reference to the topmost array is simply week[1].

A reference to a part of the topmost array beginning at a second level array (there are 3 second level arrays in this example because week[1] contains 3 elements which happen to be arrays) requires another set of square braces containing the index of the desired array: week[1][2].

Specifying a bit of information beginning at a third level array requires another set of square braces containing the desired index: week[1][2][3]. Zeroing in even further: week[1][2][3][0].

You can even specify a single character in the string literal value of a nested array because a string literal itself is considered an array, and each character of the literal an element of it (we will discuss strings in depth later on): week[1][2][3][0].charAt(37)

Although multidimensional arrays provide great organization for a lot of related information, simple arrays are easier to work with.