ARRAYS

_________________
What is array?
• Collection of variables called elements, each with the same name and
data type. These element are distinguished from one another by a
unique index called a subscript which is usually enclosed in square
brackets immediately after the array name.
• An array is a data structure that can hold multiple values (unlike a
variable, which can only hold 1 value at a time).
• Array index start from 0 (zero).
• E.g nameList[0], represent the first element in the array called
nameList
 Why use Arrays?
• Use an array when you need to group values by some common
characteristic (e.g. – Students in a classroom).
• When designing an application that performs the same processing for
multiple sets of data, use an array and a looping structure.
HOW TO DECLARE AN ARRAY?
• Declare Numeric markList[10]
• To declare an array in JavaScript, we use the array constructor and
assign the array to a variable. We give the constructor the size of the
array as an argument:
var markList = new Array(10);
• At times, we may not know the size of the array when declaring. In
such situations, we can declare an empty array:
var markList = new Array();
Declaring an array
• Declare constant SIZE = 10
• Declare Numeric markList [SIZE]

• var size = 10;

• Var markList = new Array(size);
INITIALIZING AN ARRAY
• Declare Numeric markList[] = 50,70, 20, 80,45

0 1 2 3 4
50 70 20 80 45 markList

• var markList = [50,70, 20, 80,45];

STUDENT TASK
1. A program is required to initialize the array with the following
names:
John, sipho, Bongani and Betty
LOADING AN ARRAY
markList[0] = 50
markList[1] = 70
markList[2] = 20
markList[3] = 80
markList[4] =45
0
50
1
70
2
20
3
80
4
45
markList
 LOADING AN ARRAY
• To add values to an array, assign the new values while also identifying
the index where you want JavaScript to store the new value:
markList[0] = 50;
markList[1] = 70;
markList[2] = 20;
markList[3] = 80;
markList[4] =45;
STUDENT TASK

Create an array called priceList. At the coding stage load this array with
the following prices: 4.00, 13.50, 20.00, 5.00, 100.00
LOADING ARRAY USING A FOR LOOP
Declare Numeric index
Declare Contant SIZE = 5
Declare Numeric markList[SIZE]

For index = 0 to SIZE – 1

Display “ enter marks at index ”+index
Input markList[index]
End For
 LOADING ARRAY USING A FOR LOOP
• In some instances, we can use a for loop to add values:
• var size = 10;
• var markList = new Array(size);
for(var i=0; i<size; i++)
{
markList[i]=parseInt(prompt(“Enter student
mark”));
}
 Searching Arrays
• Sequential searches
• Simplest search algorithm
• Start at beginning of array
• Compare each element’s value:
• To one you’re trying to match
• Can use a Boolean value called found
• To indicate whether a match has been found
• Initialize to False and set to True if match found
SEARCHING FOR MATCHING ELEMENT
IN AN ARRAY
QUESTION

A program is required to allow a user to input a mark. Your program

should then search the array created previously to see if matching mark
is found then display the message “ mark is found at index …… “ or “
mark not found”
 SEARCHING ARRAY USING
SEQUENTIAL SEARCH
SAMPLE INPUT
searchValue = 20 or 95

0 1 2 3 4
50 70 20 80 45
Searching Arrays
 Searching Arrays
• Example: searching for multiple matches
• Customers whose last name begins with “A”
Searching an array
Solution
Display “ Enter a mark you looking for”
Input searchMark
For index = 0 to SIZE -1
If markList[index] == searchMark then
Display “mark is found at “+index
Else
Display “mark is not found“
End IF
End For
 Parallel Arrays
• Parallel arrays gives you the ability to store multiple pieces of
information about a single entity in an application.
• Parallel arrays use a common subscript to relate data fields.
• The indexes of each array should correspond to one another for
individual entities:
• Student ID
• Student Name
• Student Exam Score
Conceptual Example of Parallel Arrays
• Arrays 0 047254 0 John 0 93

Array Name = fltExam1Scores

Array Name = strn201Class
1 038546 1 Mary 1 86
Array Name = strSID

2 Elizabeth 2 74
2 024136
3 Omar 3 92
3 057866
4 015543 4 Charles 4 56

5 025769 5 Ravi 5 82

6 025119 6 Katherine 6 89

7 035176 7 Hannah 7 82

8 036585 8 Alexander 8 75

9 028116 9 William 9 77
 Creating a Parallel Array
• To create parallel arrays, just create them as you would any other
array:
var SID = new Array();
var n201Class = new Array();
var examScr = new Array();
• The arrays are separate arrays in memory, but your program should
treat them as one …
 Assigning Values to Parallel Arrays
• To assign values for a single entity to parallel arrays, use the same
index number for each assignment:
SID[5] = “025769”;
n201Class[5] = “Ravi”;
examScr[5] = 82;
PARALLEL ARRAYS
• Array has a single name and data type
• Example: employee numbers
• Can create parallel array
• To contain other employee information
• Use a common subscript to relate data fields
• Example: arrays empNumber, empFirstName, and empLastName
empNumber[0]= employee number for Joe Smith
empFirstName[0] = “Joe”
empLastName[0] = “Smith”
 PARALLEL ARRAYS
• Example: display all employee information
• Works with nonzero employee numbers

• Example on next slide: search for employee information by last name

Parallel Arrays
 The Array. Length Property
• Just like any JavaScript objects, arrays have properties.
• One of the most useful properties is the length property, which will
give you a count of how many indexes the array has.
 The Array. Length Property
• Example of the Array.length property:
var golfScores = new Array();
var golfScrSize = 0;
golfScores[0] = 72;
golfScores[1] = 85;
golfScores[2] = 125;
//golfScrSize will get the
//value of 3
golfScrSize = golfScores.length;
 Using Array. Length
• The following code averages the values stored in an array
for(var i=0; i<golfScores.length; i++)
{
sumScores += golfScores[i]
}
avgScore = sumScores/golfScores.length;
 The ‘length’ Property of Arrays

‘d’ is an instance ‘length’ is a

of the ‘Array’ property of the
object object ‘d’

d = new Array ( 5 ) ;
document.write( d.length ) ;
The ‘length’ Property of Arrays
x = new Array ( 10 ) ;

for ( x = 0 ; x < 10 ; x = x + 1 ) {
y[ x ] = x * x ;
}
x = new Array ( 10 ) ;

for ( x = 0 ; x < x.length ; x = x +

1){
y[ x ] = x * x ;
}
Sorting an Array
• The elements in the array can be sorted in ascending order or in
descending order.
• The are many ways on how the sorting can be done. However, the
focus of this lecture will be on two methods:
o Selection Sort and
o Bubble Sort
Array Methods: sort( )
Sorts the elements in alphabetical order
x = new Array ( 4 ) ; Saqlain
x[ 0 ] = “Waseem” ; Shoaib
x[ 1 ] = “Waqar” ; Waqar
x[ 2 ] = “Saqlain” ;
Waseem
x[ 3 ] = “Shoaib” ;
x.sort( ) ;
for ( k = 0 ; k < x.length; k = k + 1 ) { document.write( x[ k ] + “<BR>” )
;
}
 Selection Sort continue…….
//Sorting an Array using selection sort
var temp=0,pos=0,lowest=0;
for (var i=0;i<numList.length-1;i++)
{
lowest =numList[i] ;
for(var j=i+1;j<numList.length;j++)
{
if(lowest>numList[j])
{
pos =j;

lowest=numList[j];

}
}
Selection Sort continue…….
//Swaping the contents of the Array
temp=numList[i];
numList[i]=lowest;
numList[pos]=temp;

}
//Displaying the contents of the Array
for(var i=0;i<numList.length;i++)
{
document.write (""+numList[i]);
}
The End!!!