Today is:
    | Home | Web Technology | Language | Articles | | About-Us | Contact-Us |

JS Tutorial     

JavaScript Ch7 - Arrays

What in this chapter:

7.1 Arrays

An array is a collection of data values. Each data value in the array has a unique index. You retrieve a value from an array by enclosing an index within square brackets after the array name. Array indexes begin with zero.

Arrays may contain any type of JavaScript data, including references to other arrays or to objects or function. For example: 

document.images[1].width
This code refers to the width property of an object stored in the second element of an array stored in the images property of the document object.

Note that the arrays described here differ from the associative arrays of an object. The regular arrays we discuss here are indexed by non-negative integers. Associative arrays are indexed by string. Also not that JavaScript does not support multidimentional arrays, except as arrays of arrays. Finally, because JavaScript is an untyped language, the elements of an array do not all need to be the same type.

7.1.1 Creating Arrays

Arrays can be created with the Array() constructor function. Once created, any number of indexed elements can easily be assigned to the array: 
var a = new Array();
a[0] = 1.2;
a[1] = "JavaScript";
a[2] = true;
a[3] = { x:1, y:3}
Arrays can also be initialized by passing array elements to the Array() constructor. 
var a = new Array(1.2,"JavaScript"
                 ,true,{ x:1, y:3});
If you pass only a single number to the Array() constructor, it specifies the length of the array. Thus: 
var a = new Array(10);
creates a new array with 10 undefined elements.

7.1.2 Array Literals

ECMAScript v3 defines (and JavaScript 1.2 implements) a literal syntax for creating and initializing arrays. An array literal (or array initializer) is a comma-separated list of values contained within square brackets. This values within the brackets are assigned sequentially to array indexes starting with zero. For example, in JavaScript 1.2 the array creation and initialization code in the previous sectio coudl also be written as: 
var a = [1.2, "JavaScript", true, {x:1, y:3}];
Array literals can be nested: 
var matrix = [[1,2,3],[4,5,6],[7,8,9]];
Also, the elements in array literals can be arbitrary expressions and need not be restricted to constants: 
var base = 1024;
var table = [base, base + 1, base + 2, base + 3];
Undefined elements can be included in an array literal by simply omitting a value between comman. For example, the following array contains five elements, including three undefined elements: 
var spareArray = [1,,,,5];

7.1.3 Reading and Writing Array Elements

You access an element of an array using the [] operator. A reference to the array (array name) should appear to the left of the brackets. An arbitrary expression that has a non-negative integer value should be inside the brackets. You can use this syntax to both read and write the value of an elements of an array. 
value = a[0];
a[1] = 3.4;
i - 2;
a[i] = 3;
a[i+1] = "hello";
a[a[i]] = a[0];

7.1.4 Adding New Elements to an Array

In languages such as C and Java, an array has a fixed number of elements that must be specified when you create the array. This is not the case in JavaScript—an array can have any number of elements, and you can change the number of elements at any time.

To add a new element to an array, simply assign a value to it: 

a[10] = 10;

7.1.5 Array Length

All arrays have a special length property that specifies how many elements the array contains. Since arrays can have undefined elements, the length property is always one larger that the largest element number in the array. Unlike regular object properties, the length property of an array is automatically updated to maintain this invariant when new elements are added to the array. The following code illustrates: 
var a = new Array(); // a.length == 0
a = new Array(10);   // a.length == 10
a = new Array(1,2,3);// a.length == 3
a = [4,5];           // a.length == 2
a[5] = -1;           // a.length == 6
a[49] = 0;           // a.length == 50
Since elements of the array may not be contiguous, it is a best practice to check if the retrieved element of the array is undefined before manipulating it. 
var fruits = new ["mango","banana", "cherry", "pear"];
for(var i = 0; i < fruits.length; ++i){
  if(fruits[i] != undefined){
     alert(fruits[i]);
  }
}
The length property of an array is a read/write value. If you set length to a value smaller than its current value, the array is truncated to the new length; any elements that no longer fit are discarded and their values are lost. If you make length larger than its current value, new, undefined elements are added at the end of the array to increase it to the newly specified size.

Truncating an array by setting its length property is the only way that you can actually shorten an array. If you use the delete operator to delete any array element, that element become undefined, but the length property does not change.

7.1.6 Multidimensional Array

JavaScript does not support true multimensional array, but it does allow you to approximate them quite nicely with arrays of arrays. To access a data element in an array of arrays, simply use the [] operator twice. For example, suppose the variable matrix is an array of arrays of numbers. Every element matrix[x] is an array numbers. To access a particular number within this array, you would write matrix[x][y];

    References

    (1) Aland Shalloway & James R. Trott, Design Patterns Explained, Second Edition.

    (2) Allen Holub, Holub on Patterns, Learning Design Patterns by Looking at Code

    (3) Eric Evans, Domain-Driven Design, Tackling complexity in the heart of software.

    Advertisement
puthik.com ©2008