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.