JavaScript : Higher Order Functions

In JavaScript, a higher-order function is a function that takes one or more functions as arguments, and/or returns a function as its result. A common use of higher-order functions is to create and use function factories. This allows you to create and use functions with a specific behavior, without having to repeatedly define the same function with different parameters.

Examples of higher-order functions in JavaScript include Array.prototype.map, Array.prototype.filter, and Array.prototype.reduce. These methods take a function as an argument and use it to transform, filter, or reduce an array, respectively.

function HOF(func) {
  return addNumber(10, 20);
}

function addNumber(x, y) {
  return x + y;
}

console.log(HOF(addNumber));

In the above example, The HOF is a Higher order function because it takes an argument as a function and then it calls addNumber() and addNumber() returning 30 and HOF again returns 30.

Higher-Order Functions that are built-in to JavaScript :

map()

map() is a higher-order function in JavaScript that creates a new array with the results of calling a provided function on every element in the calling array. The new array will have the same length as the original array, but its elements will have been transformed by the provided function.

let arr = [4, 5, 1, 4];

const newArr = arr.map((ele, index, arr) => {
  return ele * 2;
});

console.log(newArr); // [8, 10, 2, 8 ]

// arr.map(function (ele) {
//   console.log(ele);
// });

In this example, the anonymous function passed to map method, will double each element of the numbers array, and return the result in a new array, the doubles array.

The map() method does not change the original array. It returns a new array with the modified elements.

The map() method will also iterate over the objects if it is array of objects and you can use that for the desired manipulation.

filter()

filter() is a higher-order function in JavaScript that creates a new array with all elements that pass the test implemented by the provided function.

The filter() method takes a callback function as an argument, which should return a boolean value. The callback function is invoked for each element in the array and will include an element in the new array if the callback function returns true for that element.

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const newArr = numbers.filter(function (ele) {
  return ele % 2 == 0;
});
console.log(newArr); //[ 2, 4, 6, 8 ]

//arrow function
const newArrr = numbers.filter((x) => {
  return x % 2 == 1;
});
console.log(newArrr); //[ 1, 3, 5, 7, 9 ]

// array of object
let people = [
  { name: "Alice", age: 30 },
  { name: "Bob", age: 25 },
  { name: "Charlie", age: 35 },
  { name: "David", age: 28 },
];
const filtered = people.filter((ele) => {
  return ele.age >= 30;
});
console.log(filtered); //[ { name: 'Alice', age: 30 }, { name: 'Charlie', age: 35 } ]

forEach()

forEach() is a higher-order function in JavaScript that is used to execute a function once for each element in an array. The forEach() method does not change the original array, and it does not return a new array. Instead, it simply performs a specific operation on each element in the array.

let numbers = [1, 2, 3, 4, 5];
numbers.forEach(x => console.log(x * 2));

In this example, the anonymous function passed to forEach, will double each element of the numbers array, and print the result to the console.

every()

every() is a higher-order function in JavaScript that tests whether all elements in an array pass the test implemented by a provided function. The every() method takes a callback function as an argument, which should return a boolean value. The callback function is invoked for each element in the array, and the method will return true if the callback function returns true for every element in the array.

let numbers = [1, 2, 3, 4, 5];
let areAllEven = numbers.every(function(x) {
    return x % 2 === 0;
});
console.log(areAllEven);  // false

some()

some() is a higher-order function in JavaScript that tests whether at least one element in an array pass the test implemented by a provided function. The some() method takes a callback function as an argument, which should return a boolean value. The callback function is invoked for each element in the array, and the method will return true if the callback function returns true for any one element in the array.

let numbers = [1, 2, 3, 4, 5];
let isAnyEven = numbers.some(function(x) {
    return x % 2 === 0;
});
console.log(isAnyEven);  // true