JavaScript Closures and Scope 2 — Questions and Answers
Question 1: What is the scope of a variable declared with `var` inside a function?
- Block scope
- Global scope
- Function scope (Correct answer)
- Module scope
Correct answer: Function scope
Variables declared with `var` are function-scoped, meaning they are accessible anywhere within the function they are declared in, regardless of the block (if/else, loops) they appear in.
`var` declarations are hoisted to the top of their enclosing function (or global scope if not inside a function). This means a `var` inside an `if` block is accessible throughout the entire function. This is a common source of bugs, which is why `let` and `const` (which have block scope) are preferred in modern JavaScript.
Question 2: In JavaScript, what is a closure?
- A way to close the browser window
- A function that has access to variables from its outer (enclosing) scope even after that scope has returned (Correct answer)
- A method to stop a loop
- An error that occurs when a variable is undefined
Correct answer: A function that has access to variables from its outer (enclosing) scope even after that scope has returned
A closure is created when a function 'closes over' variables from its lexical environment. Even after the outer function returns, the inner function retains access to the outer function's variables.
When a function is created in JavaScript, it captures a reference to its surrounding lexical environment. This allows the function to access variables from that environment even after the outer function has finished executing. Closures are fundamental to patterns like module patterns, factory functions, and partial application.
Question 3: What will `console.log(x)` output if `x` is declared with `var` after the log statement?
- ReferenceError
- undefined (Correct answer)
- null
- The value of x
Correct answer: undefined
`var` declarations are hoisted to the top of their scope, but only the declaration — not the initialization. So accessing a `var` before its assignment returns `undefined`, not a ReferenceError.
JavaScript hoists `var` declarations to the top of the function/global scope during compilation. This means `var x` is treated as if it were at the top, but `x = value` stays in place. The variable exists but has the value `undefined` until the assignment line is reached. This is why `var` can produce confusing bugs compared to `let`/`const`.
Question 4: What is the Temporal Dead Zone (TDZ)?
- A period when setTimeout callbacks are delayed
- The time between entering a block scope and a `let`/`const` declaration being initialized (Correct answer)
- A zone where global variables are undefined
- A deprecated JavaScript feature
Correct answer: The time between entering a block scope and a `let`/`const` declaration being initialized
The Temporal Dead Zone is the region in a block scope where `let` or `const` variables are hoisted but not yet initialized. Accessing them in this zone throws a `ReferenceError`.
Like `var`, `let` and `const` are hoisted, but unlike `var` they are not initialized with `undefined`. Instead, they remain in an 'uninitialized' state from the start of the block until the declaration statement is reached. Accessing a variable in this state throws `ReferenceError: Cannot access 'x' before initialization`. This makes `let`/`const` safer.
Question 5: What is a common use of closures — creating private variables?
- Using the `private` keyword before a variable
- Wrapping state in an outer function scope that inner functions close over (Correct answer)
- Using `Object.freeze()` on the object
- Declaring variables with `const`
Correct answer: Wrapping state in an outer function scope that inner functions close over
Closures allow you to create private state by defining variables in an outer function. Inner functions close over those variables and are returned as the public API — outside code can't directly access the closed-over variables.
JavaScript does not have a `private` keyword for regular functions (class fields now do with `#`). The classic technique is to define state in an outer function and return only the methods that should be public. Those methods form closures over the private variables. External code can only interact through the returned interface.
Question 6: What is 'lexical scope' in JavaScript?
- Scope determined at runtime based on where a function is called
- Scope determined at author time based on where functions are written in the code (Correct answer)
- Scope limited to a single line
- Scope that only applies to arrow functions
Correct answer: Scope determined at author time based on where functions are written in the code
Lexical (or static) scope means that the scope of a variable is determined by where it is written in the source code, not by where the code is called from at runtime.
In lexical scoping, a function's scope is fixed at the time of writing. When a function looks up a variable, it searches its own scope first, then the scope of the function it was written inside (not called from), and so on up to the global scope. This predictable behavior is what makes closures work consistently.
What is the scope of a variable declared with `var` inside a function?