Why functions in Js are “first-class citizens”? What are “higher-order functions” in Js?

image credit: link

Why functions in javascript are “first-class citizens”?

In JavaScript, functions are referred to as “first-class citizens” because they enjoy the following characteristics, which are typically associated with data types (like strings, numbers, or objects):

(1) Assignable:

• Functions can be assigned to variables, object properties, or array elements.

const myFunction = function() {
  // Function body
};

(2) Pass as Arguments:

• Functions can be passed as arguments to other functions.

function higherOrderFunction(callback) {
  // Execute the callback function
  callback();
}

higherOrderFunction(myFunction);

(3) Return from Functions:

• Functions can be returned as values from other functions.

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

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

(4) Assigned to Data Structures:

• Functions can be stored in data structures like arrays or objects.

const functionArray = [myFunction, anotherFunction, 
                         function(name) { return `Hola, ${name}!`; }]];
const result = functionArray[2]('Bob');

(5) Constructed at Runtime:

• Functions can be created dynamically at runtime.

const multiply = new Function('a', 'b', 'return a * b');
// The signature of the Function class is: 
// new Function(arg1, arg2, ..., functionBody);
const result = multiply(3, 4);

These characteristics highlight that functions in JavaScript are not just blocks of code but are values that can be manipulated, passed around, and interacted with similarly to other data types (like strings, numbers, or objects).

Also, these characteristics collectively contribute to treating functions in JavaScript as first-class citizens, allowing them to be treated like any other data type. This flexibility and versatility empower developers to use functions in a wide range of scenarios, enabling functional programming paradigms and providing a higher level of abstraction and modularity in code.

What are “higher-order functions” in Js?

In JavaScript, a higher-order function is a function that meets at least one of the following criteria:

(1) Takes a Function as an Argument:

• The higher-order function accepts one or more functions as arguments.

(2) Returns a Function:

• The higher-order function returns a function as its result.

How are “higher-order functions” related to functions being “first-class citizens” ?

Higher-order functions in JavaScript are closely related to the concept of functions being first-class citizens. A higher-order function is a function that takes one or more functions as arguments, returns a function as its result, or both. This ability to accept and return functions makes higher-order functions possible because functions are treated as first-class citizens in JavaScript.

Here’s a brief explanation of the relationship:

(1) Passing Functions as Arguments:

• Higher-order functions often take other functions as arguments, utilizing the fact that functions are first-class citizens.

function higherOrderFunction(callback) {
  // Execute the callback function
  callback();
}

function myCallback() {
  console.log('Callback executed!');
}

higherOrderFunction(myCallback);

(2) Returning Functions:

• Higher-order functions can return functions, allowing for dynamic creation of functions based on certain conditions.

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

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

In both examples, the functions involved (passed as arguments or returned) are treated as first-class citizens. This characteristic enables the creation of flexible and reusable code patterns, supporting principles of functional programming in JavaScript.

The combination of first-class functions and higher-order functions allows developers to write more expressive and modular code, promoting concepts like function composition, closures, and abstraction in their programs.

Common use cases for higher-order functions include implementing functions like map, filter, and reduce on arrays, as well as callback-based asynchronous programming and the concept of function decorators. The ability to treat functions as first-class citizens is a key feature that makes higher-order functions possible in JavaScript.