# Array Methods

There are many methods that allow you to manipulate and utilize arrays.  Some of these include:

### Stack Methods

The `push()` method adds the arguments at the end of the array and `pop()` removes the last element of the array.

``````var names = ['alice','bob'];
names.push('cece');
var last = names.pop();
console.log(last);       // prints 'cece'``````

### Alternate Stack Methods

The `shift()` method removes the first element in the array.

The method `unshift()` adds the arguments to the beginning of the array.

``````var names = ['alice','bob'];
var first = names.shift();
console.log(first);               // prints 'alice'

names.unshift(first);
console.log(names[0]);            // prints 'alice'``````

### Reordering Methods

The `reverse()` method reverses the order of the elements in the array.

``````var names = ['alice','bob'];
names.reverse();
for (var elm of names) {
console.log(elm); // prints 'bob then 'alice'
}``````

The `sort()` method by default converts all elements to strings for comparison.

``````var values = [0, 1, 5, 10, 15];
values.sort();                  // 0, 1, 10, 15, 5 - Oops! Not in numeric order``````

The `sort()` method can also accept a comparison function as an argument. The comparison function must take two arguments and return a negative number if the first element is less than the second, 0 if they are equal, and a positive number if the first number is greater than the second.

To sort an array of integers we can use the following comparison function and sort.

``````function compare(v1, v2) {
if (v1 < v2)
return -1;
else if (v1 == v2)
return 0;
else
return 1;
}

var values = [10, 1, 15, 5, 1];
values.sort(compare);
console.log(values.toString());    // prints '1,1,5,10,15'``````

A more efficient compare function for integers is as follows.

``````function compare(v1, v2) {
return v2 – v1;
}``````

### New Arrays From Old

The `concat()` method creates a copy of the existing array then adds the elements that are passed to the function to the end of the new array.

``````var arr1 = [1, 2, 3];
var arr2 = arr1.concat(4, 5, 6);    // 1, 2, 3, 4, 5, 6
var arr3 = arr2.concat(arr1);       // 1, 2, 3, 4, 5, 6, 1, 2, 3 – concat elms in an array``````

The `slice()` method returns a subarray. The method takes a starting index and an optional ending index that specify where to splice. The element at the starting index is included, but the element at the ending index is not included.  The original array is not modified by `slice()`.

``````var arr1 = [1, 2, 3, 4, 5];
var arr2 = arr1.slice(1,4);    console.log(arr2.toString());     // prints '2,3,4'``````

The `splice()` method takes an index in the array as the first argument and allows you to delete 0 or more (second argument) elements in the array starting at the index.  The method optionally accepts additional elements that are inserted starting at the index.  The method modifies the array on which it is called and returns an array of elements that were deleted.

``````var arr1 = [1,2,3,4];
var arr2 = arr1.splice(1,2,'foo','bar','whoo','car');
console.log(arr1.toString());   // prints '1,2,foo,bar,whoo,car'
console.log(arr2.toString());   // prints '2,3'``````

### Location Methods

The `indexOf()` and `lastIndexOf()` methods search the array for an element identical (using ===) to the element passed in as the first argument. An optional second argument specifies the index where the search starts.`indexOf()` searches from front of the array to the back whereas `lastIndexOf()` searches from the back to the front.  Both methods return the index of the first element found or -1 if the element is not found.

Caution must be taken when searching for reference objects.

``````var person = {name: “Nicholas”};
var arr1 = [person];
console.log(arr1.indexOf(person));    // 0: found at index 0
var arr2 = [{name: “Nicholas”}];      // an array containing an unnamed object - not person
console.log(arr2.indexOf(person));    // -1: not found
``````

### Iterative Methods

The `every()` and `some()` methods each take a function that returns a Boolean.  When `every()` or `some()` are called, the function argument is called once for each element in the array.  Each time it is called, a different element of the array is passed into the function argument.  The function argument must return a Boolean indicating whether or not the element that is passed into it has some property.

The `every()` and `some()` methods also return a Boolean.  In the case of `every()`, if each time the function argument is applied to the elements of the array the function argument returns true, then `every()` will return true.

In the case of `some()`, if when the function argument is applied to the elements of the array, the function argument returns true at least once, then `some()` will return true.

The function that is passed in as a parameter to `every()` and `some()` should have 3 parameters: item, index and array.  When the function is called, the array element is passed in as the first argument, the index of the array element is passed in as the second argument, and a reference to the array is passed in as the third parameter.

``````var f = function(item, index, array) {
return (item > 2);
};

var numbers = [1,2,3];
var result = numbers.every(f);
console.log(result);            // false – not every element is greater than 2

var numbers = [1,2,3];
var result = numbers.some(f);
console.log(result);            // true – some elements are greater than 2``````

The `filter()` method returns a new array and has a function parameter.  The function argument must return a Boolean to indicate whether or not the array element that was passed into the function argument is to be included in the new array.

``````var g = function(item, index, array) {
return item % 2 === 0;
};

var numbers = [1,2,3,4];
var newArray = numbers.filter(g);
console.log(newArray.toString());    // prints '2,4'``````

The `map()` method also returns a new array. The function passed into the map() method returns an element which is included in the new array. Thus, one element is put in the new array for each element in the original array.

``````var h = function(item, index, array) {
if (item % 2 === 0) {
return item;
} else {
return 0;
}
};

var numbers = [1,2,3,4];
var newArray = numbers.map(h);
console.log(newArray.toString());    // prints '0,2,0,4'``````

The `forEach()` method has no return type. It iterates over the elements of the array, like a for-loop.

``````var init = function(item, index, array) {
array[index] = '0'
};

var numbers = [1,2,3,4];
numbers.forEach(init);
console.log(numbers.toString());     // prints '0,0,0,0'``````

### Reduction Methods

The `reduce()` and `reduceRight()` methods return a value that is built up by iterating a function (passed in as an argument) over the elements in the array. The `reduce()` method iterates over the elements from the start to the end, the `reduceRight()` method works in the opposite direction.

The function argument passed into `reduce()` and `reduceRight()` requires 4 parameters: prev, cur, index, and array. The first parameter holds the value that the function returned on the previous iteration, except the first time the function is executed, in which case the previous value is the value of the element stored at index 0 in the array.  The second parameter holds the value of the element at array[index].  The third parameter holds the index of the current element.  The last parameter is a reference to the array.

The `reduce()` method starts with index equal to 1.  `reduceRight()` starts with index equal to array.length – 2.

``````var add = function(prev, cur, index, array) {
return prev + cur;
}

var numbers = [1,2,3,4];
var sum = numbers.reduce(add);
console.log(sum);   // prints 10``````

© 2018, Eric. All rights reserved.