JavaScript Lesson 23: Creating Arrays Part 2

<Lesson 22> [Contents] <Lesson 24>

23.1: Declaring Arrays with Known Initial Values in JavaScript

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 follows:

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 above date, 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 Values of 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>

Click on Example 23.1 to see the output.

* 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:

<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]

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>

</head>
<body>
</body>

Click on Example 23.2 to view the output.


<Lesson 22> [Contents] <Lesson 24>

Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInShare on Reddit