chapter 11: arrays cis 275—web application development for business i

Chapter 11: Arrays

CIS 275—Web Application Development for Business I

2

Array Object An Array object is a contiguous series of storage

locations (_________) in memory. First, create the Array object. Then _____ the

Array:var famname = new Array(3)famname[0] = "Jan Egil"famname[1] = "Tove"famname[2] = "Hege“

Use a ____ loop to write an Array (note the use of the length property of the Array object):for (i=0; i < famname.length; i++) {

document.write(famname[i] + "<br />")}

http://www.w3schools.com/js/js_arrays.asp

3

Creating, Initializing, Summing

Creating Arrays var n1 = new Array( 5 ); // allocate 5-element Array var n2 = new Array(); // allocate empty Array

Three ways to initialize Arrays with lists var colors = new Array( “cyan”, “magenta”, “yellow”, “black” );

var integers1 = [ 2, 4, 6, 8 ]; var integers2 = [ 2, , , 8 ];

Summing elements in an Array for ( var i = 0; i < theArray.length; i++)

total1 += theArray[ i ]; for ( var element in theArray)

total2 += theArray[ element ];

4

Random Image Generator<html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title>Random Image Generator</title>

<script type = "text/javascript">  </script>

</head>

<body> <p>Click Refresh (or Reload) to run the script again</p> </body></html>

5

Passing Data to Functions Example

var a = [ 1, 2, 3, 4, 5 ];

Pass-by-value In JavaScript, numbers and ________ values are

passed to functions by value modifyElement( a[ 3 ] );

Pass-by-reference In JavaScript, references to ______ are passed to

functions A reference is a location in memory modifyArray( a );

6

<script type = "text/javascript"> function start(){ var a = [ 1, 2, 3, 4, 5 ];

outputArray( "The values of the original array are: ", a ); modifyArray( a ); // array a passed by reference outputArray( "The values of the modified array are: ", a ); document.writeln( "<h2>Effects of passing array " +

"element by value</h2>" + "a[3] before modifyElement: " + a[ 3 ] ); modifyElement( a[ 3 ] ); document.writeln( "<br />a[3] after modifyElement: " + a[ 3 ] ); }

function outputArray( header, theArray ){ document.writeln(header + theArray.join( " " ) + "<br />" ); }

function modifyArray( theArray ){ for ( var j in theArray ) theArray[ j ] *= 2; }

function modifyElement( e ){ e *= 2; document.writeln( "<br />value in modifyElement: " + e ); }

</script>

Fig. 11.8, p. 353

7

Sorting Arrays The Array class a built-in method called _______

for sorting arrays.anArray.sort(); // uses string comparisons for sort

An optional argument of sort is the name of a function called a ___________ function that compares its two arguments.anArray.sort(compareIntegers);

function compareIntegers( integer1, integer2 )

{

return parseInt( integer1) – parseInt ( integer2 );

}

8

sort.html Fig. 11.9, p. 355

<html xmlns = "http://www.w3.org/1999/xhtml">

<head> <title>Sorting an Array with Array

Method sort</title>

<script type = "text/javascript"> function start() {

var a=[10,1,9,2,8,3,7,4,6,5];

document.writeln( "<h1>Sorting an Array</h1>" );

outputArray( "Data items in original order: ", a );

a.sort( compareIntegers );

outputArray( "Data items in ascending order: ", a );

}

function outputArray(header, theArray)

{ document.writeln( "<p>" +

header + theArray.join( " " ) + "</p>" );

} function compareIntegers(value1,

value2){ return parseInt(value1) -

parseInt(value2); } </script>

</head> <body onload = "start()“> </body></html>

9

Searching an Array You search an array for a ______ value. The following contains the logic for a ______

search.var searchKey = “Johnson”;

var element = linearSearch(anArray, searchKey);

function linearSearch(theArray, key)

{

for ( var n = 0; n < theArray.length; ++n)

if ( theArray[n] == key )

return n;

return -1;

}

See p. 360 for the more complicated binary search (will not be covered on exam).

Multidimensional Arrays An array with two subscripts can be thought of

as a table with rows and _______ (a two-dimensional array).

In JavaScript, a two-dim array is a one-dim array whose elements are _________ arrays (rows).

Example: var b = [ [ 1, 2], [ 3, 4 ] ]; The 1st row of Array b contains 1 in the 1st column, 2

in the 2nd column The 2nd row of Array b contains 3 in the 1st column,

4 in the 2nd column Declaring a two-dim array

var b = new Array(2);

b[0]=new Array(5);

b[1]=new Array(3);

11

Manipulating Multi-Dim Arrays

Set all elements in the 3rd row of array a to zero:for( var col = 0; col < a[2].length; ++col)

a[2][col] = 0;

The same thing using for______:for( var col in a[2])

a[2][col] = 0;

Determining the total of all elements in array a:var total=0;

for(var row=0; row < a.length; ++row)

for(var col=0; col < a[row].length; ++col)

total += a[row][col];

See Fig. 11.14, p. 367

chapter 11: arrays cis 275—web application development for business i

Documents