JavaScript Arrays – creating and storing values

JavaScript Arrays – creating and storing values cover image
  1. Home
  2. JavaScript
  3. JavaScript Arrays – creating and storing values

An array can be regarded as a set of variables. This does not mean that the variables in an array are related to each other; they are still separate entities in themselves. Arrays helps us group variables, which we plan to use for a particular purpose because accessing their values becomes a lot easier this way.

Consider the following table:

Number City name
1 New York
2 London
3 New Delhi
4 Sydney
5 Tokyo
6 Moscow
7 Lima

To store these city names, we can either employ different variables such as city1, city2, city3 … or insert these values into an array. Let’s see how we make an array.

var city = new Array();

Each array is initialised using the new keyword with the Array() construct (Isn’t this similar to using Date()?). So here we initialise and array called city. Now we fill this array with our values (city names).

city[0] = "New York";
city[1] = "London";
city[2] = "New Delhi";
city[3] = "Sydney";
city[4] = "Tokyo";
city[5] = "Moscow";
city[6] = "Lima";

Each variable in an array begins with the array name followed by a numeric value contained in a pair of square brackets. This numeric value signifies the Index Number of that variable in the array. Note, that arrays are zero-indexed, that is, they start at index value 0. Also, we don’t need the var keyword to initialise individual variables of an array.

JavaScript allows us to write the array initialisation and assignment statements as one. Thus,

var city = new Array("New York", "London", "New Delhi", 
"Sydney", "Tokyo", "Moscow", "Lima");

Array values are accessed through their index names. We can use a for loop for this purpose.

var msg = "";
for (x = 0; x < 7; x++)
   msg = msg + city[x] + "\n";;

Click here for the result.

Now, don’t you see the usefulness of arrays? If we had the values in variables of different names (even city1, city2…), our alert() statement would be very long.

Values stored in arrays can be changed just like other variable values. Further, you can increase or decrease the number of items in an array… but that’s for laters.

The length of an array is found though its length property. The code below, finds the length of the array, adds 50 to each value and displays the result in an alert box.

var num = new Array(200, 400, 300, 250, 670, 430, 220, 870, 30);
var l = num.length
var msg = "";
for (x = 0; x < l; x++)
   num[x] = num[x] + 50;
   msg = msg + num[x]+ "\n";

Click here for the result.

After initialising the array num and asigning values to it, we find its length and store the value in variable l. The variable is then used in a for loop where each array value is incremented by 50.

Lastly, you can mix the data types in an array which means that in a single array, some variables can contain string while the other might contain numeric data and JavaScript wouldn’t complain!