The JavaScript Diaries: Part 11/Page 2

[previous] [next]

The JavaScript Diaries: Part 11

Creating an Array

An array is created using the new keyword. This creates a new instance of the object. Basically this means that we take the array object, make a copy of it and give that copy a name. It's a new "instance" or "occurrence" of the array object. The format for creating a new instance of an array is:

var variableName = new Array();

The format should be pretty familiar to you by now. First, we declared a variable using the var keyword. Then we used the " = " operator to equate the variable to the new instance of the array. Finally, we created a new instance of the array object using the new keyword. Since the array is an object, we placed a semi-colon (" ; ") after it.

The variable creates a reference to the new instance of the array in order to access its data. Remember, a variable is only a data container, so in this case, the variable "contains" a reference to the array to which it is referenced. Let's return to our column of data example. Many times a group of data in a spreadsheet is given a name to make it easier to refer to it in calculations and macros. Instead of writing "=SUM(B7:C16+F7:G15)," which is difficult to remember what it represents, we could give the cells names and write "=SUM(sales + bonus)," That's much easier to understand. When we use a variable to reference an array it's basically the same thing.

There are three basic methods for creating an array and storing data in it. (There are others that we will look at later.) The first two methods shown here use the constructor function.

One method creates an empty instance of an array and then populates it. In this type of array, each element is assigned an index number by the person writing the code, i.e. you.

var fruits = new Array();
  fruits[0]="apples";
  fruits[1]="oranges";
  fruits[2]="peaches";

An array can also be populated by listing each piece of data in a comma-delimited format. This method is called a dense array:

var myCar = new Array("Chevrolet","Honda","Buick","Ford");

In this example each element is given as an argument to the Array object. Remember, objects are created with the format: object();, with the parentheses following it. The parentheses can contain an argument to be used by the object. In this case, it's storing data for use by the Array object. Using this format, the index numbers are assigned automatically by the JavaScript interpreter, beginning with "0."

The difference between the first two different methods is that the first method is good for a large amount of data and the second method is better for a small amount of data. You can see where, using the second method, a large amount of data could become very confusing, i.e.:

var myCar = new Array("Chevrolet","Honda","Buick","Ford","Rolls Royce","Volkswagen","Dodge","Pontiac",
  "Chrysler","Alfa Romeo","Cadillac","Datsun","Fiat","Hyundai","Jeep","Mazda");

as opposed to:

var myCar = new Array()
new myCar[0]="Chevrolet";
new myCar[1]="Honda";
new myCar[2]="Buick";
new myCar[3]="Ford";
new myCar[4]="Rolls Royce";
new myCar[5]="Volkswagen";
new myCar[6]="Dodge";
new myCar[7]="Pontiac";
new myCar[8]="Chrysler";
new myCar[9]="Alfa Romeo";
new myCar[10]="Cadillac";
new myCar[11]="Datsun";
new myCar[12]="Fiat";
new myCar[13]="Hyundai";
new myCar[14]="Jeep";
new myCar[15]="Mazda";

As you can see, the second one is much easier to read. It takes more time, but is worth it in the long run.

The third method for creating an array is by using literal notation. The format is:

var myCar = ["Hyundai","Jeep","Mazda"]

It's similar to the one above except it doesn't use the Array object constructor and it uses brackets instead of parentheses. The Array object constructor is assumed. The JavaScript interpreter knows that the brackets mean to create an array using the given data for the elements. This method can be interpreted by browsers that are version 4.0 and later.

[previous] [next]

Created: November 24, 2005

URL: