JavaScript Tutorial JavaScript Examples JQuery Tutorial CSS Tutorial HTML Tutorial About Us

Lesson 23: Creating Arrays Part 2


In the previous lesson, we have learned that we can declare an array using the new operator in JavaScript. The new operator declares an array dynamically which means that values are assigned when the script is run. However, if the initial values are specified, we can use another way to declare an array. For example, suppose a group of students obtained the following scores in their JavaScript examination, as shown in Table 23.1

Table 23.1
Name Score
Alex 50
Brian 60
Carmen 65
Dave 75
Graham 80
Keynes 68
Morgan 70
Olson 85

We can declare two arrays from the data in Table 5.1, one for the name and the other one for the score. To declare the name array, we can use the following statement:

var   StudentName=["Alex","Brian","Carmen","Dave","Graham","Keynes","Morgan","Olson"]

The values must be enclosed in a pair of square brackets and separated by commas, the list of values is also known as initializer list. Note that you don't need to use the new operator. The subscripts of the array are 0,1,2,3,4,5,6,7 which means StudentName(0)=Alex, StudentName(1)=Brian and so forth.

As for the scores, we use the following statement:

var  Score=[50,60,65,75,80,68,70,85]

The subscripts are also 0,1,2,3,4,5,6,7 which means Score(0)=50, Score(1)=60 and so forth.

23.2 Performing Arithmetic operations on an Array

We can perform arithmetic operations on the values of an array, such as to obtain the sum and the average values.

<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>JavaScript Example 23.1</title>
<script>function Start(){
var StudentName=["Alex","Brian","Carmen","Dave","Graham","Keynes","Morgan","Olson"];
var Score=[50,60,65,75,80,68,70,85]
var sum=0 , average=0;
for (i=0; i<Score.length;i++)
sum+=Score[i];
document.writeln("Total Score is "+sum+"<br>");
document.writeln("Avearge Score is "+sum/i);

}

</script>

</head>
<body>
</body>

</html>

Total Score =

Average Score=

* Note that you have to initialize the values of sum and average as 0.

23.3 Tabulating the values of an Array

We can display the values of the array in the above example in a table easily by writing the following script. Note that you can create a table dynamically using the document.write method and by incorporating  all the HTML tags. You can write all the values using the for loop. The full script is shown below:


<script>function Start(){
var StudentName=["Alex","Brian","Carmen","Dave","Graham","Keynes","Morgan","Olson"];
var Score=[50,60,65,75,80,68,70,85]

document.writeln("<table border=\"1\""+"width=\"50%\">");
document.writeln("<thead><th>Name</th>"+"<th>Score</th></thead><tbody>");
for (i=0; i<Score.length;i++)
document.writeln("<tr><td>"+StudentName[i]+"</td><td>"+Score[i]+"</td></tr>");
document.writeln("</tbody></table>");
}

</script>

Click on Example 23.2 to view the output.


❮ Previous Lesson Next Lesson ❯


Copyright©2008 Dr.Liew Voon Kiong. All rights reserved |Contact|Privacy Policy