JavaScript Arrays

Posted: 8th October 2012 by Javid in arrays, javascript
Tags: ,

In this post I am going to talk about JavaScript arrays. Arrays are fundamental to every language and JavaScript is no exception. JavaScript arrays are a must for every programmer as their application is vast and is used in most of the programs we write. First I will walk you through the basics of arrays and then we will discuss the methods like

1: push();
2: pop();
3: shift();
4: unshift();
5: slice();

6: splice();
7:join();
8: Map();
9: sort();
10: concat();
11: reverse();

et-al.

Arrays can be declared in a number of ways. e-g

1: var array = [21,3,4,5,6,78,32,56];
2: var Array = new Array(); // array of length 0.
3: var Array = new array(5); array 0f length 5.

Methods of Arrays.
1: push();
push() is used to insert a new data element at the end of the Array.
Example:
var array = [21,3,4,5,6,78,32,56];
array.push(100);
The new value 100 will be inserted at the end of array and the new array will be like:

var array = [21,3,4,5,6,78,32,56, 100];

Consequently the length of the new Array will become 9
var array = [21,3,4,5,6,78,32,56, 100];
array.length; will return 9.

2: pop(); This method is used to remove an element from an end of the Array. Note that by removing an element from an element it doesn’t delete the element from the array. However the array length gets reduces by one and if you try to access the removed element you will get that element value as undefined.

var array = [21,3,4,5,6,78,32,56]; // initial array
arr.pop() //after pop is invoked

new array will have the following elements with last 56 as missing [21,3,4,5,6,78,32];

3: shift(); This method is similar to what pop() method does.The only difference is that shift() method shifts the elements towards the right and the newly added elements are added to the beginning of the array.
e-g array = [21,3,4,5,6,78,32,56,88];

array.shift();
New array will have [3,4,5,6,78,32,56,88];

4: unshift(); This method can be used to add an element to the beginning of an array. It is similar to what push() does except that push() method inserts an element at the end of an array while as unshift can add an element to the beginning. It creates room for the new elements at the beginning and shifts the subsequent towards right.
var array = [21,3,4,5,6,78,32,56,88]; // initial Array
array.unshift(100);
new array will have [100, 21,3,4,5,6,78,32,56,88] as new elements.

5:slice; array(start, end); This method actually creates a sub array from an existing Array. Hence this method can return a portion of an Array. slice takes two arguments:
start specifies the index of the element from which to start creating a sub array and end is the last minus 1 element from start.
if start or end has value of negative, it means that argument has a value that starts from the end of the array.

6: splice; array.splice(start, deleteCount, valuesInserted);
splice method is used to insert, remove or replace the array elements. The argument start specifies the index at which the inserion or deletion is to be started.
deleteCount is the no. of array elements to be inserted or deleted. Note that when insertions are made the newly added elements preserve the space of the existing elements and are inserted/deleted immediately after the element index specified by start.

var array = [21,3,4,5,6,78,32,56]; // initial array
array.splice(2,4,100,200,300); // start is 2, meaning that splice will start from a[2] which is 4, deleteCount is 4, means that after 5, 4 elements will be deleted.These will be 6, 78, 32, 56. 100, 200 and 300 are the new elements to be added
After operation of splice the new array will become like this:
array = [21,3,100,200,200,32,56]

7: Join array.join(separator);
join method is used to combine all the array elements with the separator. The separator can be any character like +, – / *

var array = [21,3,4,5,6,78,32,56];
array.join("*") 21*3*4*5*6*78*32*56

8: Map; array.map(f,o); map() method passes each element of the array on which it is invoked to a function, and it returns he new array whose values are computed from the function.
var array = [2,4,5];
newarray = array.map(function(x) {
return x+10;
});
newarray is now [12,14,15]

9:sort();As the name says sort() method is used to arrange the elements of an array acording to the lexicographical order. e-g our sample array when sorted will become like this:
var array = [21,23,34,125,63,178,132,156];
array.sort();
sorted array will be [125,132,156,178,21,23,34,63]
This is not a sorted array. the sort method has arranged the numbers in the lexicographic order. To perform sort() on the numeric values, we need to pass a comparator function, that will sort the array elements according to their values.

var array = [125,132,156,178,21,23,34,63];
function compare(x,y)
{
return x-y;
}
array.sort(compare);

will return the array elements sorted in the numerical order.

10: concat(); The concat() method is used to combine the array elements of one array with the array. The concat() method doesn’t change the original array. If the array to be concatenated has array within it, the array elements will be concatenated with the original array, Note that however this operation is not recursive.

var array1 = [12,34]
array2 = [14,21,[12,56]];
array1.concat(array2); // returns [12,34,14,21,12,56]

11: reverse(); array.reverse();
This method reverses the order of the array elements. It doesn’t create a new array. The order of index gets changed in the reverse process e-g:

var array = [21,4,34,56,54,3,4,98,4];
array.reverse(); //returns [4,98,4,3,54,56,34,4,21]