Explain functional programming in JavaScript.

Functional Programming (FP) is a programming paradigm that treats computation as the evaluation of mathematical functions and avoids changing state and mutable data. In JavaScript, FP principles can lead to more predictable, testable, and maintainable code, leveraging the language's first-class functions and powerful array methods.

What is Functional Programming (FP)?

At its core, FP is about building software by composing pure functions, avoiding shared state, mutable data, and side-effects. It emphasizes 'what to do' rather than 'how to do it', often leading to a declarative style of programming.

Key Concepts of Functional Programming

Pure Functions

A pure function is a function that, given the same input, will always return the same output and produce no side-effects. Side-effects include modifying global variables, changing arguments, I/O operations, or network requests.

// Pure Function
const add = (a, b) => a + b;

// Impure Function (modifies external state)
let counter = 0;
const increment = (value) => {
  counter += value;
  return counter;
};

Immutability

Immutable data means that once a data structure is created, it cannot be changed. Instead of modifying existing data, you create new data structures with the desired changes. This prevents unexpected mutations and makes code easier to reason about.

// Mutable operation
const arr1 = [1, 2, 3];
arr1.push(4); // arr1 is now [1, 2, 3, 4]

// Immutable operation
const arr2 = [1, 2, 3];
const arr3 = [...arr2, 4]; // arr2 is still [1, 2, 3], arr3 is [1, 2, 3, 4]

First-Class Functions

In JavaScript, functions are 'first-class citizens', meaning they can be treated like any other variable. They can be assigned to variables, passed as arguments to other functions, and returned from functions.

const greet = (name) => `Hello, ${name}!`;

// Assign function to a variable
const sayHello = greet;
console.log(sayHello('Alice')); // Hello, Alice!

// Pass function as an argument
const execute = (func, arg) => func(arg);
console.log(execute(greet, 'Bob')); // Hello, Bob!

Higher-Order Functions (HOFs)

HOFs are functions that either take one or more functions as arguments or return a function as their result. Common JavaScript examples include map, filter, and reduce.

const numbers = [1, 2, 3, 4, 5];

// map: takes a function and applies it to each element, returning a new array
const doubled = numbers.map(num => num * 2); // [2, 4, 6, 8, 10]

// filter: takes a function and returns a new array with elements that pass the test
const evens = numbers.filter(num => num % 2 === 0); // [2, 4]

Function Composition

Function composition is the process of combining two or more functions to produce a new function. When the output of one function is passed as the input to the next, it creates a pipeline of operations.

const add5 = x => x + 5;
const multiplyBy2 = x => x * 2;

// A simple compose function
const compose = (f, g) => (...args) => f(g(...args));

const add5ThenMultiplyBy2 = compose(multiplyBy2, add5);
console.log(add5ThenMultiplyBy2(10)); // (10 + 5) * 2 = 30

Benefits of Functional Programming

• Predictability: Pure functions always yield the same output for the same input, making them easy to reason about.
• Easier Testing: Without side-effects or external dependencies, pure functions are trivial to test in isolation.
• Easier Debugging: Immutability and absence of side effects reduce the chances of unexpected bugs.
• Concurrency Friendly: Data immutability naturally avoids race conditions, simplifying concurrent programming.
• Modularity and Reusability: Functions are self-contained and can be easily combined or reused in different contexts.

Functional Programming in JavaScript Practice

JavaScript's native features, like arrow functions, const, and powerful array methods (map, filter, reduce), make it a great language for adopting FP. Libraries like Lodash/fp or Ramda provide even more utilities for a pure functional style, emphasizing immutability and function composition.

const users = [
  { name: 'Alice', age: 30, isActive: true },
  { name: 'Bob', age: 25, isActive: false },
  { name: 'Charlie', age: 35, isActive: true }
];

// Find active users and get their names, all immutably
const activeUserNames = users
  .filter(user => user.isActive) // Returns a new array of active users
  .map(user => user.name)       // Returns a new array of names
  .sort();                      // Sorts the new array of names

console.log(activeUserNames); // ["Alice", "Charlie"]