Map, Filter, Reduce

These helper functions make life way easier. Here is a nice guide to when to use each of these functions. A summation:

• Return one thing for each existing thing: map()
• Return only some of the existing things: filter()
• Return only one new thing: reduce()
• Don't return anything, but do something with each existing thing: forEach()

map()

Allows you to manipulate each element, and returns a new array.

regular function

const array = ['Nicolas', 'Julia', 'Catherine'];
  const newArray = array.map(function(child){
    return child + ' Smith';
});
console.log(newArray);

arrow function

const array = ['Nicolas', 'Julia', 'Catherine'];
const newArray = array.map(child => child + ' Smith');
console.log(newArray);

filter()

Returns a new array consisting only of items that match your filter.

regular function

const array = ['Nicolas', 'Julia', 'Catherine'];
  const newArray = array.filter(function(child){
    return child !== 'Nicolas'
});
console.log(newArray);

arrow function

const array = ['Nicolas', 'Julia', 'Catherine'];
const newArray = array.filter(child => child != 'Nicolas');
console.log(newArray);

reduce()

This one is best demonstrated by a use case, as it's only useful when you want to return a single value from your array. Let's say you want to find out how many students are named David, as you've got multiple students with that name. Reduce can do that for you. Please Note the accumulator is the first argument for the function, and the start number is included before the closing parenthesis of your reduce function.

regular function

const students = ['William', 'Nicolas', 'David', 'Jack', 'David', 'Joe', 'Pete', 'David'];
const davids = students.reduce(function(i, name){
  if (name == 'David') return i + 1;
  else return i;
},0)
console.log('number of Davids is '+davids);   

arrow function

const students = ['William', 'Nicolas', 'David', 'Jack', 'David', 'Joe', 'Pete', 'David'];
const davids = students.reduce((i, name) => {
  if (name == 'David') return i + 1;
  else return i;
},0)
console.log('number of Davids is '+davids);   

forEach()

Here we can manipulate the original array without returning a new one.

regular function

const kids = ['Nicolas', 'Julia', 'Charlie', 'Catherine'];
kids.forEach(function(child, i){
  if (child == 'Charlie') kids.splice(i,1);
});
console.log(kids);

arrow function

const kids = ['Nicolas', 'Julia', 'Charlie', 'Catherine'];
kids.forEach((child, i) =>{
  if (child == 'Charlie') kids.splice(i,1);
});
console.log(kids);