Array.map — map all values to an expression.

Array.map(): apply “value + 1” to a set of 7 numbers [1, 2, 3, 4, 5, 6, 7]

**1] **_Expression _**value + 1 **is applied to every item in the original array.

2] .map() returns a **modified copy**of the array leaving original untouched.

3] Result: [2,3,4,5,6,7,8] (a copy of the original array is created.)

Array.filter — kell that match a condition.

Image for post

NOTE: there is a small mistake in the animation. The animation should actually return [6,7] given >5 condition not [5,6,7]. I’ll fix it shortly. . .

**1] **_function _**value > 5 **is applied to every item in the original array.

2] .filter() returns a **modified copy**of the array — the original is still available!

3] Result: [6,7,8] (only values that passed the condition.)

Array.reduce — reduce all items to a single value.

A common use for a **_reducer _**is combining prices of all items in shopping cart.

What makes reduce unique is that it uses an accumulator.

**_Accumulator _**is required to be set to a starting value. Here it is 0.

#css #javascript #programming #web-development #coding

Map, Filter and Reduce 
1.35 GEEK