Closures Interview Questions

February 26, 2026 • By Surya Singh • JavaScript • Closures • Frontend • Interview

JavaScript closures interview questions — lexical scope, execution context, practical use cases.

JavaScriptClosuresFrontendInterview

Key Takeaways

  • 1A closure is a function that "closes over" variables from its outer scope—it retains access even after the outer function returns.
  • 2In JavaScript, functions create closures; the inner function captures variables by reference, not by value.
  • 3Common use: data privacy (module pattern), partial application, callbacks, and React (useEffect, event handlers).
  • 4Stale closure: a closure captures an old value; fix with useCallback deps, or pass a function to setState.

The questions below are commonly asked in technical interviews. Each answer is written to help you understand the concept clearly and explain it confidently. Focus on understanding the "why" behind each answer—that is what interviewers care about.

In this guide

Interview Questions & Answers

What is a closure in JavaScript?

A closure is when a function retains access to variables from its enclosing (outer) scope, even after that outer function has finished executing. In JavaScript, every function forms a closure over the variables in scope where it was defined. For example, a function inside another function can read and update the outer function's variables. When the outer function returns the inner function, the inner function still "holds" references to those variables. That is why closures enable patterns like the module pattern (private variables) and callbacks that remember their context.

// C# closure - lambda captures outer variable
Func<int, int> MakeAdder(int x) {
    return n => n + x;  // x is "closed over"
}
var add5 = MakeAdder(5);
Console.WriteLine(add5(10));  // 15

// Module pattern with closure (private counter)
Func<int> MakeCounter() {
    int count = 0;
    return () => ++count;
}
var counter = MakeCounter();
Console.WriteLine(counter());  // 1
Console.WriteLine(counter());  // 2

How do closures cause stale state in React?

When you pass a callback or use useEffect, the closure captures the state values at the time it was created. If the effect or callback runs later (e.g., after a timeout or in an event handler), it sees the old state, not the current one—a stale closure. Fix: include all dependencies in the useEffect dependency array so the effect is recreated when state changes. For setState, use the functional form: setCount(prev => prev + 1) so you always get the latest value. For callbacks, ensure they are recreated when their dependencies change (useCallback with correct deps).

What is the module pattern and how does it use closures?

The module pattern uses a closure to create private variables. You wrap code in an IIFE (immediately invoked function expression) that returns an object with methods. Those methods close over variables declared inside the IIFE—variables that are not returned. From outside, you cannot access those variables directly; you can only use the public methods. This gives you encapsulation similar to private fields in a class. Modern JavaScript also has ES modules and class private fields (#) for encapsulation.

How do closures work with loops (e.g., for var i)?

With var, the variable is function-scoped, not block-scoped. So in "for (var i = 0; i < 3; i++) { setTimeout(() => console.log(i), 100); }", all three callbacks share the same i. When they run, the loop has finished and i is 3, so you get 3, 3, 3. With let, each iteration has its own i (block scope), so each closure captures a different i—you get 0, 1, 2. This is why let and const are preferred in loops. The same issue can occur with event handlers in a loop—ensure each handler gets its own value.

// C# - loop variable captured by closure (captures current value in C# 5+)
var actions = new List<Action>();
for (int i = 0; i < 3; i++) {
    int copy = i;  // capture copy per iteration
    actions.Add(() => Console.WriteLine(copy));
}
foreach (var a in actions) a();  // 0, 1, 2
// Without copy: same variable, all print 3 in older C#

What is a practical use of closures in everyday JavaScript?

Closures appear everywhere: event handlers that need to "remember" data, setTimeout/setInterval callbacks, partial application (a function that returns another function with some arguments pre-filled), and React hooks. For example, useState returns a setter that closes over the component's fiber; useEffect callbacks close over props and state. Any time a function is passed around and runs later, it likely uses a closure to access the environment where it was created. Understanding closures helps you debug stale state and design clean APIs.

Loading...

XLinkedInFacebook
Surya Singh

Surya Singh

Azure Solutions Architect & AI Engineer

Microsoft-certified Azure Solutions Architect with 8+ years in enterprise software, cloud architecture, and AI/ML deployment. I build production AI systems and write about what actually works—based on shipping code, not theory.

  • Microsoft Certified: Azure Solutions Architect Expert
  • Built 20+ production AI/ML pipelines on Azure
  • 8+ years in .NET, C#, and cloud-native architecture
LinkedInTwitter/XAbout Me