JavaScript Array Class Programming
How To Use the Array Class in JavaScript Programming Projects
Article describing the various uses for the array class and how to solve programming problems using arrays in JavaScript.
JavaScript programming often involves using arrays to store information. For example, the tags that are accessed using the document object are often returned as an array (i.e. from the document.getElementsByName method). However, arrays are also available to JavaScript programmers for their own use - as stacks, queues, or just a place to put information.
As an aside - unlike other languages with a C-like syntax, an array of characters in JavaScript is not the same as a string: the string class has other methods for string processing that have nothing to do with arrays, and the 2 are not interchangeable.
Creating an Array Object from the JavaScript Array Class
To create an array, code such as the following can be used:
myOtherArray = new Array("cheese", 3, myArray); // 3 odd elements
The first line of code creates an array of 100 elements, starting with element 0 and ending with element 99. If the programmer assigns a value to myArray[100] then JavaScript will automatically extend the array.
The other array is created with 3 elements of different types: an array does not necessarily have to contain elements where all the types are the same. There is also an indirect way to create an array:
While this may be useful in certain circumstances, many programmers avoid using this method of creating an array.
The JavaScript Array as a Stack
To use the JavaScript array as a stack, there are 2 collections of methods:
- push & pop - to add/remove elements from the end of the array;
- shift & unshift - to add/remove elements from the start of the array;
The following JavaScript application snippet illustrates a stack where elements are manipulated at the end:
myArray.push(42); // [42]
myValue = myArray.pop(); // myValue = 42 ; myArray is empty
To manipulate elements at the start, the following would be used:
myArray.push(42); // [42]
myArray.unshift(84); // [84, 42]
myValue = myArray.shift(); // myValue = 84 ; myArray = [42]
These can be combined to emulate a queue.
The JavaScript Array as a Queue
A queue is similar to a stack except that typically the elements are removed from the opposite end to which they are added. For example, a FIFO queue (First In First Out) can be emulated using unshift and pop:
myArray.unshift(42);
myArray.unshift(43);
myValue = myArray.pop(); // myValue = 42;
The other kind of queue, a LIFO (Last In First Out) is the same as a regular stack, in which elements are pushed and poped from the end.
Sorting JavaScript Arrays
Finally, a JavaScript array can be sorted by using the sort method:
Unless the programmer supplies their own sorting function (i.e. myArray.sort(my_sorting_function)), which must take 2 elements and return -1, 0 and 1 upon comparison, multi-type arrays may not be sorted correctly. This is because the elements will be converted to strings and sorted alphabetically.
Other JavaScript Array Methods
There are also some more advanced methods that are available:
- concat - joins 2 arrays, and returns a new array
- reverse - reverses the elements in the array
- slice - extract a portion of an array
- splice - add/remove elements to an array
Links
- The Sun JavaScript Reference Guide : Dry but authoritative.
- JavaScript Programming Squidoo Lens: Slightly more fun, a bit less complete, but packed with links to useful information!
