7 Amazing Array Methods to Boost your Javascript Skills Today

.filter()

filter method does exactly what its name says, It filters out the array based on certain condition.

Suppose your company marketing manager wants to run an offer for teenage app users,

Let’s Create an array of app users whose age is less than or equal to 18.

var appUsers = [16, 28 , 35, 43, 12 , 55, 18]

var findTeenagers = appUsers.filter(function(age) {
return age <= 18 })

console.log(findTeenagers);

// Expected Output - [16, 12, 18]

.map()

The map() method is very useful in building react applications, it creates a new array and calls the provided function once for each element in an array, in order.

Now, let’s create a new array and add a Pound sign before each Array elements.

var notes = [20, 100, 200, 10]

var poundNotes = notes.map( number => '£' + number);

console.log(poundNotes);

//Expected-Output ["£20", "£100", "£200", "£10"]

.reduce()-

The reduce()  method is used to reduce all items in an array to a single value

Suppose you are making an e-commerce application, Now let’s reduce the cart value in array  to single value.

var cart = [60, 85, 50, 60];

var totalCart = cart.reduce((accumulator, currentValue) => {
return accumulator + currentValue;},0);

console.log(totalCart);

// expected output = 255
// accumulator = a 
// currentValue = c
//a = 0, c = 60 => a = 60;
//a = 60, c = 85 => a = 145;
//a = 145, c = 50 => a=> 195;
//a = 195, c = 60 => 255;

.forEach()-

The forEach method executes a provided function once for each array element.

var number = [4, 2, 6];

number.forEach(function (element) {

console.log(element + ' is even');
})

// expected output = "4 is even"
// expected output = "2 is even"
// expected output = "6 is even"

.some()

Some() method checks if any of the elements in an array pass the test based on provided function .Note- It always returns a boolean value

Suppose you are the admin of an app, let’s make an admin authorization test.

var userLogin = ['customer', 'customer', 'admin', 'customer', 'customer'];

var adminLogin = userLogin.some(value => value === 'admin');

console.log(adminLogin);
// expected output = true;

.every()

The every() method checks if all elements in the array pass the test.

Let’s Check if all the users are less than 100 years old

var age = [13, 53, 99, 40, 35];

var checkAge = age.every( value => value <= 100 );

console.log(checkAge);

// expected output = true;

.find()

The find() method prints the value of the first element in an array that satisfies the function condition.

Example- Lets check product stock in an app

var productStock = [
{name: 'macbook', price: 60},
{name: 'car', price: 150},
{name: 'phone',price: 10},]

var checkProductStock = productStock.find( (item) => {return item.name === 'phone'})

console.log(checkProductStock); 

// expected output = {name: "phone",price: 10}

Learn more about Arrays and their methods here:- MDN

More Articles:-

The Ultimate guide to become a full stack web developer in 3 easy steps

Tanisk Jha

Mission-Driven Self taught Software Developer with a passion for thoughtful UI Design, collaboration and writing.

Leave a Reply

Your email address will not be published. Required fields are marked *