Single Array Example  Sort Two Dimensional Array Example  Draughts 
Start of website Alphabetical index 
var rand = new Array(maxr)
I've already defined "maxr" to be 10. This means that I have defined ten variables. The first one will be called rand [1], the next rand [2], and so on up to rand [10]. Note the square brackets! I could refer to them like this (in fact, I do refer to rand [1] further down the code), but usually we access the elements of an array one at a time via a loop, and use the loop counter to say which element we want. This is called the subscript. In "setrandom", I loop through all ten elements, setting each one equal to a random number. Since "i" is the loop counter, I can use "rand [i]" to mean the i'th element of "rand". (By the way, when I output the random numbers to the webpage using dynamic HTML, I've added a space between each one to stop them running into each other).var rand = new Array(10)
However, for some reason, when you make an array, later you often find that you need to make it bigger. This means that you not only have to change the definition, you also have to go right through the code and change every reference to how big the array is, in all the for loops, for example. This is a right bore, and you're bound to miss one, which leads to the type of bug which is difficult to track down! If you use a variable in the definition, like I have, then you can make the table bigger or smaller just by changing that one variable. Much better style!

<HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> // Global variables var maxr = 10 var rand = new Array(maxr) // set up array function setrandom() { var str = "" for (i = 1; i <= maxr; i++) { rand [i] = rnd(100) str = str + rand [i] + " " } document.getElementById('innum').innerHTML = str document.getElementById('outnum').innerHTML = "" } // Random number generator function rnd(max) { var rndnum = max * Math.random() rndnum = Math.ceil (rndnum) return rndnum } // find least number function findleast() { var least = rand [1] for (i = 1; i <= maxr; i++) { if (least > rand [i]) {least = rand [i]} } document.getElementById('outnum').innerHTML = least } </SCRIPT> </HEAD> <BODY> <BR> <INPUT TYPE=BUTTON VALUE="Generate numbers" ONCLICK="setrandom()"> <INPUT TYPE=BUTTON VALUE="Find least" ONCLICK="findleast()"> <BR><SPAN ID="innum"></SPAN> <BR><SPAN ID="outnum"></SPAN> </BODY> </HTML> 

<HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> // Global variables var max = 12 var num = new Array(max) // set up array function setnum() { for (i = 1; i <= max; i++) { num [i] = rndm(100) document.write (num [i] + " ") } } // Random number generator function rndm(max) { var rndnum = max * Math.random() rndnum = Math.ceil (rndnum) return rndnum } // sort array function sortarray() { var swap = 0 for (i = 2; i <= max; i++) { j = i while (j > 1 && num [j] < num [j  1]) { swap = num [j] num [j] = num [j  1] num [j  1] = swap j } } var str = "" for (i = 1; i <= max; i++) { str = str + num [i] + " " } document.getElementById('sorted').innerHTML = str } </SCRIPT> </HEAD> <BODY> <SCRIPT TYPE="TEXT/JAVASCRIPT"> setnum() </SCRIPT> <INPUT TYPE=BUTTON VALUE="Sort" ONCLICK="sortarray()"> <BR><SPAN ID="sorted"></SPAN> </BODY> </HTML> 
<HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> // Global variables var maxx = 100; var maxy = 20 var graph = new Array(maxx) for (x = 0; x <= maxx; x++) {graph [x] = new Array(maxy)} // set up graph function draw() { for (x = 0; x <= maxx; x++) { for (y = 0; y <= maxy; y++) { graph [x] [y] = " " } } for (x = 0; x <= maxx; x++) { y = Math.sin (x / 10); y = Math.round ((y + 1) * 10) graph [x] [y] = "." } document.write ("<PRE>") for (y = maxy; y <= 0; y) { for (x = 0; x <= maxx; x++) { document.write (graph [x] [y]) } document.write ("<BR>") } document.write ("<" + "/PRE>") } </SCRIPT> </HEAD> <BODY> <SCRIPT TYPE="TEXT/JAVASCRIPT">draw() </SCRIPT> </BODY> </HTML> 
<HTML> <HEAD> <SCRIPT TYPE="TEXT/JAVASCRIPT"> // Global variables var board = new Array(7) for (i = 0; i <= 7; i++) {board [i] = new Array(7)} player = 1 selrow = 1; selcol = 1 // set up board function setboard() { for (row = 0; row <= 7; row++) { for (col = 0; col <= 7; col++) { if (row <2) {typ = 2} else if (row > 5) {typ = 1} else {typ = 0} if ((row + col) % 2 == 0) { board [row] [col] = 1 document.write ("<IMG SRC='white.gif' ALT=''>") } else { board [row] [col] = typ document.write ("<IMG SRC='player" + typ + ".gif' ") document.write ("ALT='' ") document.write ("NAME='row" + row + "col" + col + "' ") document.write ("ONMOUSEDOWN='play(" + row + ", " + col + ")'>") } } document.write ("<BR>") } } // play function play(row, col) { if (selrow == 1 && board [row] [col] == 0) {alert ("Not a piece"); return} if (selrow == 1 && board [row] [col] != player) {alert ("Not your go"); return} if (selrow == 1) { selrow = row; selcol = col document.images["row" + row + "col" + col].src = "player" + player + "c.gif" return } if (board [row] [col] != 0) {alert ("Not empty"); return} if (Math.abs (row  selrow) == 1  Math.abs (col  selcol) == 1 ) {move(row, col); return} if (Math.abs (row  selrow) != 2 && Math.abs (col  selcol) != 2 ) {alert ("Invalid move"); return} jumprow = (row + selrow) / 2; jumpcol = (col + selcol) / 2 if (board [jumprow] [jumpcol] != (3  player)) {alert ("Invalid jump"); return} document.images["row" + jumprow + "col" + jumpcol].src = "player0.gif" board [jumprow] [jumpcol] = 0 move(row, col) } // move a piece function move(row, col) { document.images["row" + selrow + "col" + selcol].src = "player0.gif" board [selrow] [selcol] = 0 document.images["row" + row + "col" + col].src = "player" + player + ".gif" board [row] [col] = player selrow = 1; selcol = 1 player = 3  player } </SCRIPT> </HEAD> <BODY> <SCRIPT TYPE="TEXT/JAVASCRIPT"> setboard() </SCRIPT> </BODY> </HTML> 
© Jo Edkins 2005