5 Useful JavaScript Array Methods

JavaScript contains a lot of useful methods. Methods are in fact functions which perform actions on the contents of an array, string, or object. To invoke a method, attach it to the end of the item after a decimal. Some methods require parameters entered within the brackets. These take on two forms:

array/string/object.method()

array/string/object.method(parameter)

Today, we shall look at 5 useful methods for working with arrays. The following perform a variety of actions on the contents of the array. Some mutate the array, others just return values.

join()

The join() method joins the elements of an array into a string. It does not mutate the original array.

const myArray = ["Toronto", "London", "Shanghai", "New York"];
myArray.join();
// "Toronto,London,Shanghai,New York"

By default, join() inserts a comma between each element as separators. You may specify different separators by entering characters, strings, etc. as the sole parameter. For example, you may insert a space between each element by entering a blank space between two single quotes within the parameter field. The is useful for creating a sentence out of a list of words/items.

myArray.join(' ');
// "Toronto London Shanghai New York"

myArray.join(' finance ');
// "Toronto finance London finance Shanghai finance New York finance"

You may also use join() to insert the values of one array into another. For example, join array1 with array2 to create a long string containing the contents of both arrays. This is performed by attaching the join() method to the end of array1 and passing array2 in as a parameter. The following example displays the result to the console.

const array1 = [1, 2, 3, 4, 5];
const array2 = ['a', 'b', 'c'];
array1.join(array2);
// "1a,b,c2a,b,c3a,b,c4a,b,c5"

The next example is similar to the previous one except we create a new array with the results of joining arrays 1 and 2.

const array1 = [1, 2, 3, 4, 5];
const array2 = ['a', 'b', 'c'];
const array3 = array1.join(array2);
console.log(array3);
// "1a,b,c2a,b,c3a,b,c4a,b,c5"

includes()

The includes() method checks for the existence of a specified element returning a Boolean value true or false. If searching for a string, remember, like everything else in JavaScript, this is case sensitive.

const fruits = ['apple', 'banana', 'strawberry'];
fruits.includes('banana');
// true
fruits.includes('kiwi');
// false

pop()

The pop() method is used to remove or ‘pop’ the last element off an array. Compared to some of the other methods used to mutate an array, ‘pop’ by name is easier to make sense of.

const days = ['Monday', 'Tuesday', 'Wednesday'];
days.pop();
// Wednesday
days;
// ["Monday", "Tuesday"]

push()

The push() method may be used when you would like to to add or ‘push’ a new element onto the end of an array. This too has a name that makes sense. We will look at other array-mutating methods at another date. I chose the two with the best names for today’s article.

const fruits = ['apple', 'banana', 'strawberry'];
fruits.push('pear');
// ["apple", "banana", "strawberry", "pear"]

reverse()

The reverse() method reverses the order of the array. This method does not mutate the array. In the following example, the reversed array is output to the console.

const someNumbers = [1, 2, 3, 4, 5];
someNumbers.reverse();
// [5, 4, 3, 2, 1]

The results may also be assigned to a new array by creating a new one with the original array containing the attached method.

const someNumbers = [1, 2, 3, 4, 5];
const reversedNumbers = someNumbers.reverse();
console.log(reversedNumbers);
// [5, 4, 3, 2, 1]

JavaScript array methods are very useful. There are several more to be discussed in future articles. New methods are being added from time to time when the ECMAScript standard updates (usually annually). Please visit http://www.ecma-international.org/ for more information.

JavaScript continues to grow and gain new features with each update. I am not sure if it is possible to know everything about JavaScript or any programming language for that matter. There is no need to learn every single thing. Just stick to what is needed for the task at hand.