JavaScript Higher-Order Functions

What are higher-order functions in JavaScript?

Higher-order functions are functions that can take other functions as arguments or return them as output. They enable functional programming patterns, allowing for greater flexibility and abstraction in your code.

How do you create a higher-order function?

You can create a higher-order function by defining a function that accepts another function as a parameter or returns a function as its result.


function greet(name) {
  return `Hello, ${name}!`;
}

function higherOrderFunction(callback, name) {
  return callback(name);
}

console.log(higherOrderFunction(greet, 'Alice')); // Hello, Alice!

What is a function that returns another function?

A function that returns another function is often called a factory function. It can be used to create customized functions with specific behavior.


function createMultiplier(factor) {
  return function(x) {
    return x * factor;
  };
}

const double = createMultiplier(2);
console.log(double(5)); // 10

How can you use higher-order functions for callbacks?

Higher-order functions can accept callback functions to be executed later. This is commonly used in asynchronous programming and event handling.


function fetchData(callback) {
  setTimeout(() => {
    const data = { id: 1, name: 'Alice' };
    callback(data); // Calling the callback with data
  }, 1000);
}

fetchData((data) => {
  console.log('Data received:', data); // Data received: { id: 1, name: 'Alice' }
});

What is the `map()` method and how does it relate to higher-order functions?

The map() method is a higher-order function that creates a new array populated with the results of calling a provided function on every element in the calling array.


const numbers = [1, 2, 3, 4];
const squares = numbers.map(num => num * num);
console.log(squares); // [1, 4, 9, 16]

What is the `filter()` method and how is it a higher-order function?

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


const numbers = [1, 2, 3, 4, 5];
const evens = numbers.filter(num => num % 2 === 0);
console.log(evens); // [2, 4]

What is the `reduce()` method and how does it work as a higher-order function?

The reduce() method is a higher-order function that executes a reducer function on each element of the array, resulting in a single output value.


const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 10

How can you create a higher-order function that accepts multiple callbacks?

You can create a higher-order function that takes multiple callbacks and executes them based on certain conditions or events.


function executeCallbacks(callbacks) {
  callbacks.forEach(callback => {
    callback();
  });
}

const sayHello = () => console.log('Hello!');
const sayGoodbye = () => console.log('Goodbye!');

executeCallbacks([sayHello, sayGoodbye]);
// Outputs:
// Hello!
// Goodbye!

What are the benefits of using higher-order functions?

The benefits of using higher-order functions include:

Improved code reusability and modularity.
Enhanced abstraction, allowing for cleaner and more readable code.
Facilitating functional programming techniques.
Ability to create customized functions based on specific behaviors.

Can you explain closures in the context of higher-order functions?

A closure is created when a function retains access to its lexical scope, even when the function is executed outside that scope. Higher-order functions often use closures to create private variables and encapsulate state.


function makeCounter() {
  let count = 0; // Private variable

  return function() {
    count++;
    return count; // Accessing the private variable
  };
}

const counter = makeCounter();
console.log(counter()); // 1
console.log(counter()); // 2

What are some common use cases for higher-order functions?

Common use cases for higher-order functions include:

Array manipulation using methods like map(), filter(), and reduce().
Asynchronous programming and event handling with callback functions.
Creating factories that return functions with customized behavior.
Implementing functional programming techniques such as currying and partial application.

Ads

‹ JavaScript Interview