Functional programming examples in JavaScript

functional-programming.js

// COMMON OPERATIONS ON ARRAYS:

// CREATE A NEW VARIABLE
// Array.map => create a new array from an existing array. Each return is a new element of the new array
// Array.filter => create a new array: keeps elements when return true, removes elements when return false
// Array.reduce => create something new (number, string, object, array...) from an existing array. return adds things to the accumulator (acc)

// EXECUTE SIDE EFFECTS
// Array.foreach => Do stuff with each array item (it does not return anything)

// OTHER STUFF
// Array.findIndex => Returns the index of the FIRST iteration that returned true
// Array.find => Returns the item of the FIRST iteration that returned true


/**
 * PRACTICAL EXAMPLES WITH AN ARRAY OF OBJECT
 */

const examResults = [
  {
    name: 'Alice',
    mark: 10,
  },
  {
    name: 'Bob',
    mark: 20,
  },
  {
    name: 'Joe',
    mark: 50,
  },
  {
    name: 'John',
    mark: 100,
  },
]


// MAP
// Make an array with all student names
const studentNames = examResults.map((examResult) => {
  return examResult.name
})

console.log(studentNames, 'studentNames')


// FILTER
// Make an array only with results <= 50
const resultsLessThanAverage = examResults.filter((examResult) => {
  return examResult.mark <= 50
})

console.log(resultsLessThanAverage, 'resultsLessThanAverage')


// REDUCE
// GET THE EXAM MARK AVERAGE
const sumOfMarks = examResults.reduce((acc, examResult) => {
  return acc + examResult.mark
}, 0) // acc starts with a value of 0
const numberOfStudents = examResults.length
const averageOfMarks = sumOfMarks / numberOfStudents
console.log(averageOfMarks, 'averageOfMarks')


// FOREACH
// DO SOME STUFF WITH EXAM EVENTS
function fakeSendEmailToStudent(studentName, mark) {
  // This fake function represents a SIDE EFFECT
  // It DOES something, but it DOES NOT RETURN something
  console.log('I just sent an email to ' + studentName + ' his mark is ' + mark)
}

examResults.forEach(examResult => {
  fakeSendEmailToStudent(examResult.name, examResult.mark)
})


// FIND INDEX
// Find the index of Bob exam result
// If findIndex doesn't find anything, it will return -1
const bobIndex = examResults.findIndex((examResult) => {
  return examResult.name === "Bob"
})
const bobResults = examResults[bobIndex]
console.log(bobResults, 'bobResults')


// FIND
// Find Bob exam result
// If findIndex doesn't find anything, it will return undefined
const bobResultsFromFind = examResults.find((examResult) => {
  return examResult.name === "Bob"
})
console.log(bobResultsFromFind, 'bobResultsFromFind')


// IF AND NO IF

// THIS IS SAME AS...
const bobIndex1 = examResults.findIndex((examResult) => {
  return examResult.name === "Bob"
})

// ...USING AN IF 
const bobIndex2 = examResults.findIndex((examResult) => {
  if (examResult.name === "Bob") {
    return true
  } else {
    return false
  }
})

// ...SHORTHAND
const bobIndex3 = examResults.findIndex(examResult => examResult.name === "Bob")

// ...SHORTHAND + object destructuring
const bobIndex4 = examResults.findIndex(({name}) => name === "Bob")