In previous blog we discussed what array exactly is and its four methods :

1)push( )

2)pop( )

3)shift( )

4)unshift( )

In this blog we will cover another four methods of array.

5) map(function(el,index,array) ) =>

• Action : to perform same operation with each element of array
• Return type : array (return new array)

We use this method when we want new array after performing some operation on each element of existing array without any change in the existing array.

Syntax : let ' arrayOne ' be any array and we are applying map method on it.

let oneReturn  =  arrayOne.map(function(el ,index ,array){
return    operation to be performed eg. el+2
}
console.log(oneReturn)

Now, here oneReturn will store the array which is returned by map method. Parameter of map method is a call back function and again parameters of this call back function are :

• el = current element in array
• index = index of current element
• array = array on which we called map method

Let's take an example.

Problem statement is "Multiply each element of array by 2."

So, this can be written by using map method as below :

let arr1  = [ 1, 2, 3, 4, 5, 6, 7, 8, 9]
let arr2  = arr1.map(function( el, index, array){
return el*2
}
console.log(arr2)                //[2,4,6,8,10,12,14,16,18]

So first time el=1, index=0 so this loop will run first time for current element i.e. 1 Next time current element i.e. el=2,index=1 so this time loop will run for this element i.e. 2 and so on.

We see how we can do it by using for loop.

let arr1  =  [ 1, 2, 3, 4, 5, 6, 7, 8, 9]
for(let i=0 ;i<arr1.length ;i++ ){
console.log(arr1[ i ]  *  2)
}

But by using for loop we can not get array.

The output will be:

O/P  :  2
           4
           6
           8
           10
           12
           14
           16
           18

We can get array by using for loop with push method. Let's see how.

let arr2  =  [ ]
let arr1  =  [ 1, 2, 3, 4, 5, 6, 7, 8, 9]

for(let i=0 ; i < arr1.length ; i++){
let aa= arr1 [ i ] * 2
arr2.push(aa)
}

console.log(arr2)       //[ 2, 4, 6, 8, 10, 12, 14, 16, 18]

But this is very long for simple calculation so we can reduce and simplify code for given problem statement by using map method.

for practice : arrayTwo = [12,24,25,60,20] Add 5 to each element of array by using map method.

6) filter(function( el, index, array)) =>

• Action : Filter out elements from array which satisfy the specific condition
• Return type : Array (array of filtered elements)

As name indicates it will filter out required elements. Syntax :

let filterd= arrayName.filter(function( el, index, array){
return (condition)
})
console.log(filtered)

Now, variable 'filtered' will store the array which is returned by filter method. again same

• el=current element
• index = index of current element
• array = array on which we called filter method

Let's take example

Problem statement is "Filter out the elements in array greater than 5" So let' s see how it can be done.

let arrayThree=[1,2,3,4,5,6,7,8,9,10]
let moreThan5=arrayThree.filter(function( el, index, array){
return el > 5
})
console.log(moreThan5)       //[6,7,8,9,10]

So when el=1, index= 0 the call back function will check wheather current element i.e. 1
is greater than 5 or not if not it will go to next element and so on.

When any element satisfy the condition '> 5' filter method will return that element and that element will reflect in the array returned by filter method.

Now we will see how we can do it by using for loop with push method.

let arrayThree  =  [1,2,3,4,5,6,7,8,9,10]
let greater  =  []
for(let i=0 ;i < arrayThree.length; i++){
if(arrayThree[ i ] > 5){
greater.push(arrayThree[ i ]
}
console.log(greater)       //[ 6, 7, 8, 9, 10]

This code can be reduced and simplified by using filter method.

7) forEach(function( el, index, array)) =>

• Action : To perform same operation with each element of array quiet similar to map
• Return type : But it returns nothing

Syntax : Let 'arr1' be any array and we are applying forEach method on it.

 let each = arr1.forEach(function(el ,index ,array){
operation to be performed with each element
})
console.log(each)

Let's take example.

Problem statement is "Print each element of array"

let arr3 = [1,13,34,6,7,78]
arr3.forEach( function (el ,index ,array){
console.log(el)
})

O/P : 1
         13
         34
         6
         7
         78

Here this method act as for loop.

When el=1 the call back function block is executed for it i.e it will print 1 then el=13 the call back function block is executed for it i.e it will print 13 and so on.

As this method do not return anything no need to store it in any variable. Now let's see how we can do it by using for loop .

let arr3 = [1,13,34,6,7,78]
for(let i=0 ; i < arr3.length ; i++){
console.log(arr3[ i ])
}

8) reduce(function(acc,el,index,array)) =>

• Action : to reduce the elements in single value by performing some operations on it
• Return type : single value

Syntax : let arr4 be any array and we are applying reduce method on it.

let ret=arr4.reduce(function(acc,el,index,array){
return acc= -----
},0(you can set any value of acc))

This method reduce array by performing some operation on it to a single value. Let's take example.

Problem statement is "Print addition of all elements of array"

let arr5=[1,2,3,4,5,6]
let ret5=arr5.reduce(function(acc,el,index,array){
return acc= acc + el
},0)
console.log(ret5)   //21

Here, ret5 stores the single value returned by reduce method. There are four parameters to the call back function of reduce method.

• acc = accumulator store the final result , default value of acc is 0
• el= current element
• index = index of current element
• array = array on which reduce method is called We can set different value for acc. Let's see how

Problem statement is "Print product of all elements of array"

let arr8=[2,3,4]
let ret8=arr8.reduce(function(acc,el,index,array){
return acc= acc * el
},1)
console.log(ret8)  // 24

1st step :

• acc=1, el=2
• after call back function block execution
• acc= acc x el = 1 x 2
• updated value of acc = 2

2nd step:

• acc= 2 , el =3
• after call back function block execution
• acc= acc x el = 2 x 3
• updated value of acc = 6

3rd step :

• acc = 6 , el =4
• after call back function block execution
• acc = acc x el = 6 x 4
• updated value of acc = 24

4th step : the reduce method return the value of acc which is stored in ret8. So we get 24 as output.

Now let's see how we can write code by using for loop for below problem statement. Problem statement is "Print addition of all elements of array"

let arr5=[1,2,3,4,5,6]
let addition=0
for(let i=0; i < arr5.length; i++){
addition  =  addition + arr5[ i ]
}
console.log(addition)     // 21

Note : Difference between map and forEach method is that map method returns array but forEach method do not return anything.