Javascript Data Structure Tutorial - Javascript Array Modifier








Adding Elements to an Array

There are two mutator functions for adding elements to an array: push() and unshift().

Example

The push() function adds an element to the end of an array:

var nums = [1,2,3,4,5]; 
console.log(nums);
nums.push(6); 
console.log(nums);

The code above generates the following result.

Using push() is more intuitive than using the length property to extend an array.

The following code shows how to append element to the end of an array.

var nums = [1,2,3,4,5]; 
console.log(nums);
nums[nums.length] = 6; 
console.log(nums);

The code above generates the following result.

unshift() method

We can add array elements to the beginning of an array with unshift() method.

Here is how the function works:

var nums = [2,3,4,5]; 
console.log(nums); 
var newnum = 1; 
nums.unshift(newnum); 
console.log(nums); 
nums = [3,4,5]; 
nums.unshift(newnum,1,2); 
console.log(nums); 

The code above generates the following result.

We can add multiple elements to an array with one call to the function using unshift().





Removing Elements from an Array

Removing an element from the end of an array can be done with the pop() function:

var nums = [1,2,3,4,5,9]; 
nums.pop(); 
console.log(nums);

The code above generates the following result.

To remove an element from the beginning of an array we can use shift().

Here is how the function works:


var nums = [9,1,2,3,4,5]; 
nums.shift(); 
console.log(nums);

The code above generates the following result.

Both pop() and shift() return the values they remove.


var nums = [6,1,2,3,4,5]; 
var first = nums.shift(); // first gets the value 6 
nums.push(first); 
console.log(nums);

The code above generates the following result.





Adding and Removing Elements from the Middle of an Array

To add elements to an array using splice(), we have to provide the following arguments:

  • The starting index to add elements
  • The number of elements to remove. Use 0 to add elements.
  • The elements we want to add to the array

The following program adds elements to the middle of an array:


var nums = [1,2,3,7,8,9]; 
var newElements = [4,5,6]; 
nums.splice(3,0,newElements); 
console.log(nums);

The code above generates the following result.

The elements spliced into an array can be any list of items passed to the function.


var nums = [1,2,3,7,8,9]; 
nums.splice(3,0,4,5,6); 
console.log(nums); 

The code above generates the following result.

Here is an example of using splice() to remove elements from an array:


var nums = [1,2,3,100,200,300,400,4,5]; 
nums.splice(3,4); 
print(nums);

The code above generates the following result.

Putting Array Elements in Order

reverse() method can reverse the order of the elements of an array.

The following code shows how to use the reverse() method.


var nums = [1,2,3,4,5]; 
nums.reverse(); 
console.log(nums);

The code above generates the following result.

To sort the elements of an array, use sort() function with strings:


var names = ["D","M","C","C","B","R"]; 
names.sort(); 
console.log(names);

The code above generates the following result.

The sort() function sorts data lexicographically, assuming the data elements are strings.

We can make the sort() function work for numbers by passing in an ordering function as the first argument to the function.

This is the function that sort() will use when comparing pairs of array elements to determine the order.

  • If the number returned is negative, the left operand is less than the right operand;
  • if the number returned is zero, the left operand is equal to the right operand;
  • if the number returned is positive, the left operand is greater than the right operand.

function compare(num1, num2) { 
    return num1 -num2; 
} 

var nums = [3,1,2,100,4,200]; 
nums.sort(compare); 
console.log(nums);

The code above generates the following result.

The sort() function uses the compare() function to sort the array elements numerically rather than lexicographically.