IntermediateJavaScript

Closures

Understand what a closure actually is, why functions remember the scope they were created in, and how to use closures for data privacy, function factories, and memoization.

Reading Time

18 min

Lesson

Lesson 36 of 48

What is a Closure?

A closure is what you get when a function keeps access to the variables from its lexical scope, even after the outer function that created that scope has already finished running. In plain terms: a function remembers where it was born. Every function in JavaScript forms a closure over its surrounding scope the moment it's created — you don't have to do anything special to enable it. What makes closures interesting is what happens when the inner function outlives the outer one: normally you'd expect the outer function's variables to be thrown away once it returns, but if an inner function still references them, they stick around in memory instead of being garbage collected.

The Simplest Possible Closure

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

The Classic Counter Example

The most common way closures are introduced is with a counter. Each call to makeCounter() creates a brand-new count variable and a brand-new increment function that closes over it. Because the two counters returned below each close over their own separate count, incrementing one has zero effect on the other — they are not sharing any state, even though they were created by the exact same function.

A Counter Built with Closures

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

Closures in Loops: the var vs. let Pitfall

One of the most frequently asked interview questions about closures involves a loop with setTimeout(). If you declare the loop counter with var, every callback closes over the same single variable, because var is function-scoped — there's only one i for the entire loop, and by the time the timers fire, the loop has already finished and i holds its final value. Switching to let fixes this, because let is block-scoped: each iteration of the loop gets its own fresh binding of i, so each callback closes over a different variable.

var vs. let Inside a Loop

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

Fixing the var Version Without let

Before let existed, developers fixed this by wrapping the loop body in an immediately invoked function expression (IIFE) that took i as a parameter, creating a new function scope — and therefore a new closure — on every iteration. let simply does the same thing automatically at the language level.

Practical Use: Data Privacy

Because a closure keeps its variables inaccessible from the outside world, closures are one of the main ways JavaScript achieves private state. The balance variable below can only ever be read or changed through the functions returned by createAccount() — there is no way to reach in and set balance directly from outside, since it was never attached to the returned object itself.

Private State with a Closure

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

Practical Use: Function Factories

A function factory is a function that returns other, customized functions. Each returned function closes over the arguments the factory was called with, so you get a family of related functions without repeating logic. This is closures used for configuration rather than for hiding state.

Building Functions with a Factory

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

Practical Use: Memoization and Currying

Closures also power memoization — caching the result of an expensive calculation so repeated calls with the same input skip the work the second time around. The cache object below lives inside the closure created by memoize(), invisible to outside code, but remembered across every call to the returned function. The same idea underlies currying, where a function returns a chain of smaller functions, each one closing over the arguments collected so far.

A Simple Memoized Function

Try it yourself — edit and run

Console Output

Click “Run” to see the console output here.

Where Closures Show Up in Real Code

Private variables and encapsulation (like the bank account example)
Function factories that generate customized functions
Memoization and caching layers
Event handlers and callbacks that need to remember context
The module pattern, used to avoid polluting the global scope

Gotcha: Closures Capture Variables, Not Values

A closure captures a reference to the variable itself, not a snapshot of its value at the time the inner function was created. If the outer variable changes after the closure is created but before it's called, the closure will see the updated value — this is exactly why the var loop example above logs 4 three times instead of 1, 2, 3. Closures are live links to their variables, not frozen copies.

A Mental Model That Helps

Think of a closure as a backpack a function carries around. Whenever a function is created, it packs a backpack with references to every variable it might need from its surrounding scope. Wherever that function is later called — even in a completely different part of the program — it still has that backpack with it.

Interview Questions

Quick Quiz

1. What is a closure?

A function that has no parametersA function that remembers the variables from its lexical scope even after the outer function has returnedA method that closes a running programA block of code inside curly braces

2. Why does a for loop using var with setTimeout() typically log the same final value multiple times?

Because var is function-scoped, so all the callbacks share the same variableBecause setTimeout() always runs callbacks in reverse orderBecause var variables cannot be used inside closuresBecause arrow functions ignore var declarations

3. How does using let instead of var fix the loop/setTimeout issue?

let makes setTimeout() run synchronouslylet automatically clears the call stack after each iterationlet creates a new block-scoped binding for each iteration, so each closure captures its own variablelet converts the loop into a recursive function

4. Which of these is NOT a typical practical use of closures?

Creating private variables that cannot be accessed from outsideBuilding function factories that generate customized functionsMemoizing expensive function callsDeclaring a variable as a global constant

5. In the createAccount() example, why does account.balance return undefined?

Because balance was never declaredBecause balance is a private variable captured by closure, not a property on the returned objectBecause JavaScript objects cannot store numbersBecause deposit() deletes balance after each call

6. What does the following code log?

function makeCounter() {
  let count = 0;
  return function () {
    count++;
    return count;
  };
}

const counter1 = makeCounter();
const counter2 = makeCounter();

console.log(counter1());
console.log(counter1());
console.log(counter2());

1, 2, 31, 2, 11, 1, 1undefined, undefined, undefined

7. What does this loop log?

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}

0 1 23 3 30 0 01 2 3

Previous Next

Closures

What is a Closure?

The Simplest Possible Closure

The Classic Counter Example

A Counter Built with Closures

Closures in Loops: the var vs. let Pitfall

var vs. let Inside a Loop

Fixing the var Version Without let

Practical Use: Data Privacy

Private State with a Closure

Practical Use: Function Factories

Building Functions with a Factory

Practical Use: Memoization and Currying

A Simple Memoized Function

Where Closures Show Up in Real Code

Gotcha: Closures Capture Variables, Not Values

A Mental Model That Helps

Interview Questions

Q1. How would you implement a function that can only run once, no matter how many times it is called?

Q2. How would you build a counter with closures, and why can outside code not tamper with the count directly?

Q3. What is a common memory leak caused by closures, and how do you prevent it?

Q4. How do closures make currying possible?

Q5. What is a closure in JavaScript?

Q6. Why does using var in a loop with setTimeout produce unexpected results, and how does let fix it?

Q7. How can closures be used to create private variables in JavaScript?

Q8. Do closures capture the value of a variable or a reference to it?

Q9. What is a function factory and how does it rely on closures?

Quick Quiz

1. What is a closure?

2. Why does a for loop using var with setTimeout() typically log the same final value multiple times?

3. How does using let instead of var fix the loop/setTimeout issue?

4. Which of these is NOT a typical practical use of closures?

5. In the createAccount() example, why does account.balance return undefined?

6. What does the following code log?

7. What does this loop log?