QJavaScript · Interview preparation
What is lexical scope in JavaScript?
Lexical scope means a function can access bindings based on where it was written, not where it is called.
The idea to remember.
Lexical scope means a function can access bindings based on where it was written, not where it is called. This rule is the foundation of closures and nested functions.
01Learn by doing
From first example to real project.
Start with the smallest working idea, examine a more detailed example, then look at a real application pattern. Adapt dependencies, error handling and data models to your project.
Basic: closure remembers a binding
01 / BEGINNERThe returned function can still use a variable from its outer scope.
function createCounter() {
let count = 0;
return () => ++count;
}
const next = createCounter();
console.log(next()); // 1
console.log(next()); // 2Intermediate: block scope
02 / INTERMEDIATEEach iteration can keep its own binding with let.
const callbacks = [];
for (let i = 0; i < 3; i++) callbacks.push(() => i);
console.log(callbacks.map(fn => fn())); // [0, 1, 2]Real scenario: isolate private state
03 / REAL SCENARIOA factory can retain private data without exposing it globally.
function createCart() {
const items = [];
return {
add: item => items.push(item),
total: () => items.reduce((sum, item) => sum + item.price, 0)
};
}02Check your understanding
Try it in your own words.
Explain what is lexical scope in JavaScript without looking at the code. Then modify the intermediate example, describe one trade-off and identify when the real-world pattern fits.
Keep learning here.
Explore more in-depth guides, exercises and related interview questions in this library.
Browse JavaScript study guides ↗