Introduction to data structures and algorithms in javascript: Arrays pt. 2

August 6, 2012
Introduction to data structures and algorithms in javascript: Arrays pt. 2

This is a continuation of a series on data structures in javascript. If you have been following
along, the last post introduced the javascript Array. This week we will take a closer look at some of the
methods available in javascript to manipulate an Array.

Array.concat

Array.concat joins two or more Arrays to create a new Array. Since it creates a new Array, it’s
important to understand that the original Array’s will remain unchanged.

var someArray = [ 1, 2, 3 ];
var anotherArray = [ 4, 5, 6 ];
 
var combinedArray = someArray.concat(anotherArray);
document.writeln(combinedArray); // prints 1, 2, 3, 4, 5, 6

Array.every

Array.every is a method that accepts a function as an argument. Each element in the Array is passed
to the function and evaluates if a condition is true or false. If all elements return true for the
Array, then the every method will return true. If at least one element returns false, then the
every method will return false.

var someArray = [ 1, 2, 3 ];
var anotherArray = [ 4, 5, 6 ];
var evaluateNum = 6;
 
var isLessThan = function(value) {
    return value < evaluateNum;
}
 
document.writeln(someArray.every(isLessThan)); // prints 'true'
document.writeln(anotherArray.every(isLessThan)); // prints 'false'

Array.filter

Array.filter will create a new Array of elements that evaluate to true in the given function. This
method passes the current value, the index, and a pointer to the array to the function.

var someArray = [ 1, 2, 3, 4, 5, 6 ];
var evaluateNum = 4;
 
var isLessThan = function(value) {
    return value < evaluateNum;
}
 
document.writeln(someArray.filter(isLessThan)); // prints 1, 2, 3

Array.forEach

Array.forEach passes each element of the Array to a given function. This is all this method does.
There is no return value. It’s simply an alternate to the common for loop and may be useful for
reusing common logic while looping through Array’s.

var someArray = [ 1, 2, 3 ];
 
var printArray = function(value, index) {
    document.writeln(index +' - '+ value);
}
 
someArray.forEach(printArray); // prints 0 - 1, 1 - 2, 2 - 3

Array.join

Array.join will output an Array as a string with a given delimiter. It is useful for sending a
string to the server that can be parsed using the delimiter.

var someArray = [ 1, 2, 3 ];
var delimited = someArray.join('-');
 
document.writeln(delimited); // prints 1-2-3

Array.indexOf

Array.indexOf will search the Array until it finds a match for a give search criteria. Once the
match is found, it will return the index of the matching element. It is important to note that it
will return the first match only. It will return -1 if no matches are found.

var someArray = [ 1, 2, 3, 3, 4, 5 ];
 
document.writeln(someArray.indexOf(3)); // prints 2
document.writeln(someArray.indexOf(9)); // prints -1

Array.lastIndexOf

Array.lastIndexOf provides the same functionality as Array.indexOf, but searches for a match in
reverse order.

var someArray = [ 1, 2, 3, 3, 4, 5 ];
 
document.writeln(someArray.lastIndexOf(3)); // prints 3
document.writeln(someArray.lastIndexOf(9)); // prints -1

Array.map

Array.map will return a new array containing values in the Array that are determined by a given
function.

var someArray = [ 1, 2, 3, 4, 5, 6 ];
var evaluateNum = 4;
 
var isLessThan = function(value) {
    if  (value < evaluateNum) {
        return 1;
    }
    return 0;
}
 
var newArray = someArray.map(isLessThan);
document.writeln(newArray); // prints 1, 1, 1, 0, 0, 0

Array.reverse

Array.reverse intuitively reverses the order of the Array.

var someArray = [ 1, 2, 3, 4, 5, 6 ];
someArray.reverse();
 
document.writeln(someArray); // prints 6, 5, 4, 3, 2, 1

These are the most commonly used useful Array methods. In the next post, we will introduce some ofthe more advanced methods including methods used for creating stacks and queues.