The Array – Your Closet Organizer

There comes a time when you have a lot of stuff and need to put it somewhere. But you also need to easily access each piece of stuff in a hurry. Enter the array, which is sort of like a shelf or an organizer for your closet. An array is a container with many compartments.

The array has a name and stores each item inside. Each item is referred to by a number, starting with 0. Say we wanted an array to hold the names of cars. In Javascript, it looks like this:

carnames = new Array("ferrari","bugatti","porsche","volkswagen");

In this case, the name of the array is carnames. The array contains four items. They’re referenced by numbers 0, 1, 2 and 3. The numbering of array items starts with zero.

When you want to use one of the items from your closet organizer, you can call it by the name of the array and its corresponding number, like this:


Say you had a page element that you wanted to pull in the name ferrari. Your page element is called label. Your request could look something like this:

document.getElementById("label").value = carnames[0];

Arrays can be used to store text strings, numerical values and even file names. Say you had an image on your page that you wanted to swap out with others from a selection of images. Your array could look this way:

pictures = new Array("img/picture1.jpg","img/picture2.jpg","img/picture3.jpg");

Your element on the page is called imgdrop. A reference to swap the image for the file called picture2.jpg could look like this:

document.getElementById("imgdrop").src = pictures[1];

Arrays are a wonderful tool for many uses. You can read more about them in this handy tutorial!