Q120: Functional Programming Patterns in JavaScript

What Interviewers Want To Evaluate

This question checks whether you understand functional programming concepts as practical JavaScript tools. Interviewers want pure functions, immutability, higher-order functions, composition, currying, reducers, declarative transformations, side-effect boundaries, and trade-offs.

Senior answers should avoid dogma and explain where functional patterns improve maintainability.

Short Interview Answer

Functional programming in JavaScript means using functions as values, keeping transformations predictable, and controlling side effects. Pure functions return the same output for the same input and do not mutate external state. Higher-order functions accept or return functions. Composition builds larger behavior from smaller functions. These patterns help testing, state updates, and data transformations, but overusing abstraction can make code harder to read.

Detailed Interview Answer

JavaScript supports functional programming because functions are first-class values.

You can:

pass functions as arguments
return functions from functions
store functions in objects and arrays
compose functions into pipelines

This makes functional style natural for array transformations, state reducers, validation, and event handling.

Pure Functions

A pure function has no observable side effects and returns the same output for the same input.

function addTax(price, rate) {
  return price + price * rate;
}

Pure functions are easy to test because they do not depend on hidden state.

Impure Functions

Impure functions interact with external state, time, randomness, I/O, or mutation.

function addItem(item) {
  cart.push(item);
  console.log("added");
}

Impurity is not always bad. Real apps need I/O. The goal is to keep side effects intentional and near boundaries.

Immutability

Immutability means creating new values instead of mutating existing ones.

const nextUser = {
  ...user,
  name: "Meera",
};

This helps change detection and reduces accidental shared mutation.

Higher-Order Functions

A higher-order function accepts a function or returns a function.

function withLogging(fn) {
  return function wrapped(...args) {
    console.log("calling", fn.name);
    return fn(...args);
  };
}

Common array methods like map, filter, and reduce are higher-order functions.

map, filter and reduce

const activeNames = users
  .filter((user) => user.active)
  .map((user) => user.name);

This expresses what data should be produced rather than manually controlling every loop step.

reduce is powerful but can become unreadable if it does too much.

Composition

Composition connects small functions.

const trim = (value) => value.trim();
const lowercase = (value) => value.toLowerCase();
const normalizeEmail = (value) => lowercase(trim(value));

Small named functions make behavior easier to test and reuse.

Currying and Partial Application

Currying transforms a function that takes multiple arguments into a sequence of functions.

const hasRole = (role) => (user) => user.roles.includes(role);

const admins = users.filter(hasRole("admin"));

This can make reusable predicates and transformations concise.

Use it carefully. Excessive currying can feel cryptic to teams that do not use it often.

Reducers

Reducers are common in state management.

function reducer(state, action) {
  switch (action.type) {
    case "increment":
      return { ...state, count: state.count + 1 };
    default:
      return state;
  }
}

A reducer should be predictable: given state and action, it returns next state.

Side-Effect Boundaries

Functional code is strongest when pure logic is separated from side effects.

function buildRequestPayload(form) {
  return {
    name: form.name.trim(),
    email: form.email.toLowerCase(),
  };
}

async function submitForm(form) {
  const payload = buildRequestPayload(form);
  return fetch("/api/users", {
    method: "POST",
    body: JSON.stringify(payload),
  });
}

The payload builder is pure. The submitter owns I/O.

Referential Transparency

Referential transparency means an expression can be replaced by its value without changing behavior.

const total = sum(items);

If sum(items) is pure, it can be reasoned about safely. This improves testing and refactoring.

Common Mistakes

A common mistake is treating functional programming as a rule that every loop must become reduce.

Another mistake is hiding side effects inside functions that look pure.

function calculateTotal(items) {
  analytics.track("calculated");
  return items.reduce((total, item) => total + item.price, 0);
}

The name suggests calculation, but the function sends analytics.

Senior Trade-Offs

Functional patterns improve predictability, but abstraction has cost.

Use pure functions for business rules, selectors, validators, reducers, and transformations.

Use straightforward imperative code when it is clearer for complex control flow, performance-sensitive loops, or step-by-step procedures.

Code or Design Example

const byActive = (user) => user.active;
const toOption = (user) => ({
  label: user.name,
  value: user.id,
});

function buildUserOptions(users) {
  return users.filter(byActive).map(toOption);
}

The transformation is testable and the side-effect-free pieces are reusable.

Debugging Workflow

When functional code is hard to maintain:

check whether function names reveal intent
check hidden mutation or side effects
check overused reduce or currying
extract pure transformations
keep I/O at boundaries
measure performance for large pipelines
prefer clarity over clever point-free style

Interview Framing

Explain pure functions and first-class functions first. Then discuss higher-order functions, composition, immutability, reducers, and trade-offs.

Revision Notes

Functional programming in JavaScript is a practical toolbox. Use it to make transformations predictable and side effects explicit.

Key Takeaways

The senior version of functional programming is not clever syntax. It is designing code where data transformation is easy to test and side effects are easy to find.

Follow-Up Questions

1. What is a pure function?
2. What is a side effect?
3. What is immutability?
4. What is a higher-order function?
5. When is reduce useful?
6. What is function composition?
7. What is currying?
8. Why are reducers predictable?
9. How do functional patterns help testing?
10. When is imperative code clearer?

How I Would Answer This In A Real Interview

I would define pure functions, immutability, and higher-order functions, then show a transformation pipeline. I would also say that functional style is valuable when it improves predictability, but senior code chooses clarity over cleverness.