Dealing with the fundamentals of javascript is a very important aspect when learning javascript. In this article, I will be writing on how to deal with the fundamentals of javascript with my focus on Array Methods.

The array methods Map, Sort, Reduce and filter will really improve your javascript skills when understood perfectly, I will be throwing out some bunch of examples on how to get better at working with these methods.

Some programmers do refer to this methods as the gateway drugs to functional programming

I will be working with the Data below to explain the methods better.

Const inventors = [

{ first: ‘mark’, last: ‘zuck’, year: 1600, passed: 1879 },

{ first: ‘2pac’, last: ‘Shakur’, year: 1660, passed: 1779 },

{ first: ‘Armando’, last: ‘Maradona’, year: 1653, passed: 1856 },

{ first: ‘Eminem’, last: ‘marshal’, year: 1578, passed: 1688 },

{ first: ‘Pele’, last: ‘Nascimento’, year: 1509, passed: 1859 },

{ first: ‘Michael’, last: ‘Jordan’, year: 1590, passed: 1679 },

{ first: ‘Elon’, last: ‘reeve’, year: 1630, passed: 1899 }

];

In the above, each inventor is an object

So let’s kick it off!

Filter

Filter works by passing in it a function that will loop over every single item in an array from the first object to the last which then gives a new array of the values that returns true to what was requested for ( a conditional statement or whatnot! )

An example is given below

// Array.prototype.filter()

// filter the list of inventors for those born in 1600

Const Sixteen = inventors. Filter(function(inventor)

{ If (inventor.year >= 1600 && <=1699) {

Return True;

} };

console.table(sixteen);

Map

Map takes in an Array, does a particular instruction with the array and then returns a new array but of the same length

I like to think of Map as a factory machine that takes in a raw material, Refines it and then bring it out on the other side. Unlike filter, where it filters and bring out only what is needed, Map will bring out the item as you give it.

An example is given below

//Array.prototype.map

//give us an array of the inventory first and last names

Const fullnames = inventors.Map(inventor => inventor.first + ‘ ‘ + invnetor.last);

Console.log(fullnames);

Sort

Sort works by taking two items, an instance is when you are asked to sort just those two items e.g. if person A is older than person B if so put person A on top and then B follows.

This is done by returning 1 and then -1 which bubble the items up and down in the array.

An example is given below

//Array.prototype.sort

//sort the inventors by birthdate, oldest to youngest

Const order = inventors.Sort(function(a, b) {

If (a.year > b.year ){ Return 1;

} else {

Return -1;

} });

console.table(order);

PS: you can also use ternary operator for the above.

Reduce

Reduce works like a SORT in a MAP, it takes items in and then sort them to something else or filter them down.

It allows you to build something(object) on every single one(object), it takes in multiple actions unlike the other array methods

An example is given below;

//Array.prototype.reduce

//How many years did all the inventors live ?

Const totalYears = inventors.reduce((total, inventor) =>{

Return total + (inventor.passed — inventor.year);

}, 0);

console.log(totalYears);

The above explained is not a concise and thorough explanation of Array methods and their usage in javascript, this article only gives a brief explanation about the Array methods, their definitions and examples

Thanks for Reading!