Creating an Array

Arrays in JavaScript are created using the new operator, which works as the constructor for an Array() object. You’ll learn a great deal more about constructors and the new operator in Chapter 7, “ Working with Objects.” For now, it’s enough to know that a constructor is the mechanism for creating an object of some kind (such as an Array() object). Constructors are invoked with the new operator.

With the new operator and the Array() object’s constructor, there are a number of variations you can use to create arrays for fun and profit.

The simplest way to create an array is to declare a variable and assign a new Array() object to it. For example, this statement:

 var theArray = new Array(); 

creates a new array named theArray. One thing that’s interesting about this statement is that it doesn’t specify how many values, also called elements, the array has.

If you know how many elements you’ll need to store in your array, it’s easy to modify the statement slightly to specify this at the time the array is declared. For example, this statement:

 var theArray = new Array(42); 

creates an array with 42 elements.

You should know that JavaScript arrays, like arrays in most modern programming languages, are zero-indexed. This means that the first element in the array has an index value of zero (not one, as you might expect). The last element in the array has an index value of the number of elements in the array less one (not the number of elements in the array, as you’d expect if the index started at one rather than zero).

Note

The number of elements in an array can be retrieved using the length property of the array, as I explain later in this chapter.

Taking the array created with the statement var theArray = new Array(42);, the elements in the array can be retrieved using a zero-based index as shown in Table 6-1.

Table 6-1: Zero-Based Index and Array Elements

Index	Element
0	1st
1	2nd
...	...
40	41st
41	42nd

As you can see in Table 6-1, the index value of N – 1 is used to access the Nth element in an array, which is another way of putting the fact that the index for a 42-element array runs from zero to 41.

I wouldn’t be making such a big fuss about the index of an array starting at zero except that it has big practical consequences. It’s a true fact (and there are no false facts, at least in this book!) that the vast majority of software errors are caused by being off by one number (so-called “one-off” errors). If you get used to thinking of array indices starting at zero in the first place, you’re far less likely to make errors, and your life will be happier.

It’s also possible to load an array up with values at the time it’s created. To do this, when you create the array using the new constructor, specify the values in order. Here’s an example:

 var trekArray = new Array ("Live", "long", "and", "prosper!"); 

Table 6-2 shows the index and element values for the four-element array created and populated this way.

Table 6-2: Index and Element Values for trekArray

Index	Element Value
0	Live
1	long
2	and
3	prosper!

Advanced

In case you’re wondering, not all the elements in a JavaScript array have to be of the same type. This is different from many other computer languages, in which all the elements in an array have to be of the same type.

Do It Right!

As you saw in the “ Returns are Good ” section in Chapter 5, “ Understanding Functions,” understanding the type of a variable can be important. So, this can get a bit tricky with JavaScript arrays. JavaScript tries to make the best guess it can for the type of values stored in variables, and this goes as well for values stored as array elements.

Generally, if a number is stored as the first element of an array (with an index of 0), JavaScript will assume that each other element saved to the array is also a number—until it hits something, such as the text string frodo that doesn’t evaluate to a number. After that, every element stored to the array is taken to be a string.

Conversely, if the first element saved to an array is a text string, then JavaScript goes on the operating assumption that all the elements are string type, even when the element assigned to the array is a number such as 3. (If you put quotes around the 3 so it looked like "3", then JavaScript would know the value is a string.)

It’s best not to get too caught up in the details of how JavaScript decides the type of a value. In your programs, check to see if it’s important that a value is of a particular type. In the example shown in Chapter 5, JavaScript needed to know that the values passed to a function were numbers, not strings, so that + could be used as the plus operator rather than as the string concatenation operator. As I showed you in Chapter 5, in this kind of situation, you can explicitly convert the values to numerical types using the Number function. (Another function I didn’t discuss in Chapter 5, String, converts numbers to text strings.)

JavaScript is a great language for learning to program because it’s so accessible. (As I said at the beginning of this book, all you need is a Web browser and any operating system.) But it’s not the clearest of languages when it comes to understanding the types of values in it. You’ll find this issue easier to deal with in other languages when the time comes for you to move on to a language such as Visual Basic, C#, or Java.

Anyhow, I digress. Let’s get back to the topic of learning how to work with arrays in JavaScript.