Boost your Skills with These JavaScript Methods

Shahrooz Me

Hi, I'm Shahrooz, a front-end developer. I'm the author of this blog, nice to meet you!

→ Follow me on Twitter!

JavaScript has great support for higher-order functions, in such a way it feels natural to work with them. This special kind of function, which either take functions as input or outputs another function, is widely used for event callbacks, Node.js middlewares and data manipulation.

If you don’t know about higher-order function check out my previous post.

There is some built in higher-order functions for arrays in JavaScript that can make your life easier.

The methods we’ll be looking at:

  • forEach
  • includes
  • some
  • every
  • filter
  • map
  • reduce

Array.prototype.forEach

The forEach() method loops/iterates through an array, and provides you the ability to modify each element in an array.

Let’s say you have some cars in your garage and need a system to check each one and print their names for you.

const cars = ['BMW', 'Jaguar', 'Mazda'];
cars.forEach(car => console.log(car));
// BMW
// Jaguar
// Mazda

For more details on Array.prototype.forEach see the MDN docs.

Array.prototype.includes

The includes() method is used to check if a specific string exists in an array, and returns true or false. Keep in mind that it is case sensitive.

Let’s say for whatever reason that you are not aware of what books you have in your bookshelf, and you need a system to check if the book you want exists or not.

const bookshelf = ['Good to Great', 'Rework', 'Billion Dollar Whale'];
const findBook = bookshelf.includes('Rework');
console.log(findBook); // true

For more details on Array.prototype.includes see the MDN docs.

Array.prototype.some

The some() method checks if some elements exists in an array, and returns true or false. This is similar to concept of includes() method, except the argument is a function and not a string.

Let’s say you are a club owner, and you don’t care who enters the club. But some are not allowed in.

const age = [16, 17, 18, 24];
const result = age.some(person => person >= 18);
console.log(result); // true

For more details on Array.prototype.some see the MDN docs.

Array.prototype.every

The every() method loops through the array, checks every item, and returns true or false. Same concept as some, except every item must satisfy the conditional statement, otherwise, it will return false.

The last time you allowed some underage students to enter the club, someone reported this and the police caught you. This time you won’t let that happen, and you’ll make sure that everyone passes the age limit.

const age = [16, 17, 18, 24];
const result = age.every(person => person >= 18);
console.log(result); // false

For more details on Array.prototype.every see the MDN docs.

Array.prototype.filter

The filter() method creates a new array with all elements that pass the test.

Let’s say you want to rent a house but you only prices that are lesser or equal to 500.

const prices = [450, 800, 999, 500, 1100, 200];
const result = prices.filter(price => price <= 500);
console.log(result); // [450, 500, 200]

For more details on Array.prototype.filter see the MDN docs.

Array.prototype.map

The map() method creates a new array with the results of calling a provided function on every element in the calling array.

Let’s say you have a list of numbers. What you need is another list but this time you want to multiply the value of every item by two.

const numbers = [4, 5, 6, 7];
const multipliedNumbers = numbers.map(number => number * 2);
console.log(multipliedNumbers); // [8, 10, 12, 14]

For more details on Array.prototype.map see the MDN docs.

Array.prototype.reduce

The reduce() method executes a reducer function (that you provide) on each member of the array resulting in a single output value. It’s important to see that you have an accumulator and a current value.

Let’s say you have a list of number that you want to add this numbers together.

let numbers = [6, 42, 90, 67, 90, 31];
const reducedValue = numbers.reduce((acc, cur) => acc + cur)
console.log(reducedValue);

For more details on Array.prototype.reduce see the MDN docs.