Skip to main content

Higher Order Functions in JavaScript Explained Simply

 

What is a higher order function?

In JavaScript, a higher-order function is a function that takes one or more functions as arguments, or returns a function as output. These functions are a powerful feature of the language that allow you to write concise and expressive code.

The best way to learn higher order functions (and likely the most “real-world”) is to look at “map()” and “filter()”. Both take functions as arguments where the function is applied to each element in an array.

  • Map

For example, consider the map function, which is used to apply a function to each element of an array and return a new array containing the results.

The map function is a higher-order function because it takes a function as its argument, in this case the function to apply to each element of the array.

const numbers = [1, 2, 3, 4, 5];
const squares = numbers.map(x => x * x);

  • Filter

Another common higher-order function is filter, which is used to select elements from an array based on a certain criteria. The filter function takes a function as its argument, which is used to test each element of the array. Here’s an example of using filter to select only the even numbers from an array:

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0); // [2, 4]
  • Reduce

The reduce() function can be used to combine all elements of an array into a single value.

Higher order functions can be combined with other functional programming concepts such as currying and partial application to create powerful abstractions and improve code reusability.

Comments

Post a Comment

Popular posts from this blog

Basic CRUD Array Operations in JavaScript

  Sometimes it pays just to stick to the basics. Here are CRUD operations for a basic array: 1. Create an element to the end of an array let clubs = ['baseball','running','computer club']; clubs.push('tennis'); console.log(clubs); 2. Delete an element from the end of an array let clubs = ['baseball','running','computer club']; const lastElement = seas.pop(); console.log(lastElement); 3. Reading an index from an element in an array let clubs = ['baseball','running','computer club']; let index = clubs.indexOf("running"); console.log(index); 4. Update an index from an element in an array let clubs = ['baseball','running','computer club']; clubs.splice(1, 0, 'tennis'); console.log(clubs);
Post a Comment
Read more

Immutability in JavaScript

  Immutability is a popular concept not just in JavaScript, but most programming languages in general. The reason behind this of course is functional programming which gives software developers a brand new paradigm to utilize when coding. Let’s dive into the details of mutability and immutability. What is Mutability? A mutable value is one that can be changed without creating an entirely new value.   In JavaScript, objects and arrays are mutable by default, but primitive values are not.  Once a primitive value is created, it cannot be changed, although the variable that holds it may be reassigned. There is nothing wrong with mutability. Take a look at the code below: const dog = { name: 'turtle', age: 10 } // Make a copy of dog object const newDog = dog; // Changing the age of the new dog newDog.age = 12; console.log(newDog === dog); // true As you can see, we’re copying the object to another object and changing the dogs age. The problem is that the change happe...
Post a Comment
Read more