|
An array in javascript is a variable where many values may be stored.
Arrays in Javascript
In the javascript example program 1 below, the statement var x = [20,30,40]; defines an array with 3 elements. You can access the value of any of the three elements defined using an index starting from 0. In this example we can access the 3 elements as follows:
x[0] is the first element and its value is 20
x[1] is the second element and its value is 30
x[2] is the first element and its value is 40
If you try to access x[3], you will have an undefined value because it has non been defined.
Run Javascript Example Program 1 and check that the result displayed is 20 which is the value of x[0]. Change the index of x and check that the value is as expected. Try to access x[3] and x[10] with indexes outside the range 0-2 and the result displayed should be undefined.
Javascript Example Program 1
<!DOCTYPE html>
<html>
<body>
<script>
var x = [20,30,40];
alert(x[0]);
</script>
</body>
</html>
Length of an Array
In the javascript example program 2 below, the property length is used to find the number of elements of an array. When you run the sample program below, the result should be 5 which is the number of elements in the array.
Javascript Example Program 2
<!DOCTYPE html>
<html>
<body>
<script>
var x = [10,6,7,8,9];
alert(x.length);
</script>
</body>
</html >
2-Dimensional Arrays in Javascript
2-Dimensional arrays in javascript can be defined as an array of arrays. In example program 3 below, the statement var x = [ ]; defines an array. Then each of the statement x[0] = [20,30,40];, x[1] = [200,300,400]; and x[2] = [2000,3000,4000]; define a new array of 3 elements each as follows:
x[0] = [20,30,40]; defines the elements x[0][0] = 20, x[0][1] = 30 and x[0][2] = 40
x[1] = [200,300,400]; defines the elements x[1][0] = 200, x[1][1] = 300 and x[1][2] = 400
x[2] = [2000,3000,4000]; defines the elements x[2][0] = 2000, x[2][1] = 3000 and x[2][2] = 4000
We now have a 2-dimensional array that can be accessed using two indexes i and j as follows: x[i][j]
Run Javascript Example Program 3 and check that the result displayed is 400 which is the value of x[1][2]. Change the indexes and check that the value is as expected.
Javascript Example Program 3
<!DOCTYPE html>
<html>
<body>
<script>
var x = [ ];
x[0] = [20,30,40];
x[1] = [200,300,400];
x[2] = [2000,3000,4000];
alert(x[1][2]);
</script>
</body>
</html>
Arrays are more suitable when used in loops. There will more tutorials on arrays in the section about loops in javascript.
Books and References
1 - A Smarter Way to Learn JavaScript: The new approach that uses technology to cut your effort in half - Mark Myers
2 - JavaScript and JQuery: Interactive Front-End Web Development 1st Edition - Jon Duckett - ISBN-13: 978-1118531648
3 - A Smarter Way to Learn HTML & CSS: Learn it faster. Remember it longer. (Volume 2) - Mark Myers
4 - http://www.w3schools.com/js/default.asp - JavaScript Tutorial
|
