<New code>

//INIT: var exampleArr = [];
— define an empty array
//INIT: exampleArr[ 0 ] = 6;
— assigns 6 to the first element of exampleArr
//INIT: var stringArr = [ "Red", "Orange", "Yellow", "Green", "Blue", "Indigo", "Violet" ];
— defines an array with the elements listed
//INIT: var listString = "do,ra,mi,fa,so,la,ti,do";
var stringArr = listString.split(',');
— defines a string array with the elements listed

//OUTPUT: console.log( stringArr[ 0 ] )
— prints "Red" to the console log

All your data in a row...

Variables can hold many different kinds of information

String information

var exampleVar = "Hello!";

Numerical information

var exampleVar = 32;

Boolean (true/false)

var exampleVar = true;

Object information

var exampleVar = { firstName: "Steve", lastName: "Jobs" };

Function information

var exampleVar = function () { console.log( "I'm inside a function!" ); };

There is another kind of variable structure called an array. Arrays are a series of other variables.

To create an object, we enclose the object properties inside curly brackets: {}.

But to create an array, we enclose the series inside square brackets: []. For example:

//INIT: set up stringArr
var stringArr = [
	"Red",
	"Orange",
	"Yellow",
	"Green",
	"Blue",
	
	"Indigo",
	"Violet"
];

//INIT: set up numberArr
var numberArr = [
	2,
	3,
	5,
	7,
	11,
	
	13,
	17,
	19,
	23,
	29
];

//INIT: set up booleanArr
var booleanArr = [
	true,
	false,
	true,
	true,
	false,
	
	true,
	true
];

Arrays are numbered starting with zero.

Let's look again at our string array example:

//INIT: set up stringArr
var stringArr = [
	"Red",
	"Orange",
	"Yellow",
	"Green",
	"Blue",
	
	"Indigo",
	"Violet"
];

We can index numbers to find the values of the individual elements of the array.

Notice that the first element of the array is at index zero. Arrays always start counting from zero.

This means the last element of an array with length n will always be at index n - 1.

In our example, the seven element stringArr's last element is at index 6.

Adding to an empty array

You don't have to create an array all at once. You can create an empty array and then add directly to the array.

//INIT: set up primeNumbersArr
var primeNumbersArr = [];

primeNumbersArr[ 0 ] = 2;
primeNumbersArr[ 1 ] = 3;
primeNumbersArr[ 2 ] = 5;
primeNumbersArr[ 3 ] = 7;
primeNumbersArr[ 4 ] = 11;

primeNumbersArr[ 5 ] = 13;
primeNumbersArr[ 6 ] = 17;
primeNumbersArr[ 7 ] = 19;
primeNumbersArr[ 8 ] = 23;
primeNumbersArr[ 9 ] = 29;

primeNumbersArr[ 10 ] = 31;	

//Note: it helps to group your arrays into fives to help humans count the elements

Displaying a whole array

If you use an array reference, exampleArr, i nstead of an individual array element, exampleArr[0], it will return the entire contents of your array separated by commas:

For example:

//the following line will show all the elements of stringArr, separated by commas:
document.querySelector( '#buttonId').innerHTML = stringArr;

Click to trigger document.querySelector( '#buttonId' ).innerHTML = stringArr;

This is really handy for lots of things. It is very handy for debugging: you can output the contents of arrays to the console log, for example. Check look at the developer console to see what comes out...

console.log( 'stringArr:' + stringArr );

Using .split() to create arrays

There is a string method called .split() that will split a string into an array:

//INIT: create an array of notes
var noteString = "do,ra,mi,fa,so,la,ti,do";
var noteArr = noteString.split(',');

console.log( 'noteArr:' + noteArr );

I often use .split() to make typing in arrays easier.

Learn more

• Khan Academy's Intro to arrays
• w3schools.com's JavaScript Arrays and JavaScript Array methods and JavaScript .split()