Functional Programming in Javascript – forEach()

Hi, functional programming provide us tools to abstract common collection operations into reusable, composable build blocks.

Arrays are everywhere and using functional programming will help us work with arrays maybe you should know the methods that are already included with the array like: map, filter, reduce – so if you already use this functions then you are using Functional programming in your code.

Using functional programming in your code means that we are solving problems with less or little code.

Look this example where I have this function that is traversing an array and printing every value of the array:

// Function to go to every position in the array
function trasversingArray(myArray) {

    // using a for loop to go through every position of the array in every cycle 
    for (counter = 0; counter < myArray.length; counter++) {
        // printing every value of the array example  position: myArray[0] ---> value: cristina
        console.log('myArray value --->', myArray[counter]);
    }
}


trasversingArray(['cristina', 'gonzalo', 'nayeli', 'efrain', 'karolina']);

Result:

forEach() method

Nice, but see with Functional programming we can do the same but with less code and for this example we can use the forEach method of array.

Check this next code and see how we removed the for loop, the counter, the myArray[counter] and using the forEach is reducing our code and is more easy to read.

// Function to go to every position in the array
function trasversingArray(myArray) {

    // using a forEach method to go through every position of the array and passing a function in every element of the array
    myArray.forEach(function(name) {
        console.log('myArray value --->', name);
    })
}


trasversingArray(['cristina', 'gonzalo', 'nayeli', 'efrain', 'karolina']);

Result:

Also, if we want we can use ES6 version just to simplify our code like this:

// Function to go to every position in the array
function trasversingArray(myArray) {

    // using a forEach method to go through every position of the array and passing a arrow function in every element of the array
    myArray.forEach(name => console.log('myArray value --->', name))
}


trasversingArray(['cristina', 'gonzalo', 'nayeli', 'efrain', 'karolina']);

Result:

Nice, here is the definition of forEach method:

This method call the provided function once for each element of the array.

myArray.forEach(callback(element, index, arr), thisValue)

Note: this forEach method do not generate a new array.

forEach method accepts 5 parameters:

• callback: function to be called for each element of the array.
• element: The value of the elements being processed currently.
• index: Is optional, is the index of the current value element in the array starting from 0.
• array: Is optional, it holds the complete array on which Array.every is called.
• thisArg: Is optional, it holds the context to be passed as this to be used while executing the callback function. If the context is passed, it will be used like this for each invocation of the callback function, otherwise undefined is used as default.

Nice, how I ready mentioned “Using functional programming in your code means that we are solving problems with less or little code.”

By Cristina Rojas.

Functional Programming in Javascript – map()