Understanding map() and filter() in Array in JavaScript

When you work with Arrays in JavaScript there are two methods that come very very handy which are map() and filter().

Of course there are other methods too that are important but these are frequently used.

map()

It is a method that act's on an Array and this method is going to have an anonymous function within it.

In this function, certain business logic is executed on each and every element of the Array, and the result of the function is stored as a result in another array (not the source array).

const a = [1, 2, 3]
const b = a.map(v => v*2) // [2,4,6]

Check this 👇 to understand it even more better.

filter()

It also is a method like map() that act's on an Array and this method is going to have an anonymous function within it.

Calling filter() on an array will create a new array and the filter() method will have a condition within it. Each element in the original Array is taken and a condition is performed on it. If the condition returns true, that element will be included in the resultant Array.

const a = [1, 2, 3, 4, 5, 6, 7]
const b = a.filter(v => v > 3)   //[4, 5, 6, 7]

Let's understand this also with an exmaple!

Along with this there are a few more methods on Arrays that are also very frequenlty used and we will talk about that in the next post.

Hope this is helpful!