Variable hoisting behavior in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of var hoisting in function scope

What is the output of this JavaScript code?

Javascript

function test() {
  console.log(x);
  var x = 5;
  console.log(x);
}
test();

A undefined\nundefined

B 5\n5

C ReferenceError: x is not defined

D undefined\n5

💡 Hint

Remember that var declarations are hoisted but not their assignments.

The variable x is hoisted to the top of the function with an initial value of undefined. So the first console.log(x) prints undefined. Then x is assigned 5, so the second console.log(x) prints 5.

❓ Predict Output

intermediate

Output of let hoisting in block scope

What happens when this code runs?

Javascript

console.log(a);
let a = 10;

A 10

B ReferenceError: Cannot access 'a' before initialization

C undefined

D null

💡 Hint

Variables declared with let are hoisted but not initialized immediately.

The variable a is hoisted but is in a temporal dead zone until its declaration is reached. Accessing it before initialization causes a ReferenceError.

❓ Predict Output

advanced

Output of var and function hoisting combined

What is the output of this code snippet?

Javascript

console.log(foo);
var foo = 1;
function foo() {}
console.log(foo);

A [Function: foo]\n1

B 1\n1

C undefined\n1

D ReferenceError: foo is not defined

💡 Hint

Function declarations are hoisted before var declarations.

The function foo is hoisted first, so the first console.log(foo) prints the function. Then the var foo = 1 assignment overwrites foo with 1, so the second console.log(foo) prints 1.

❓ Predict Output

advanced

Output of const hoisting and temporal dead zone

What will this code output or error?

Javascript

console.log(bar);
const bar = 3;

A TypeError: Assignment to constant variable.

B undefined

C ReferenceError: Cannot access 'bar' before initialization

D 3

💡 Hint

Const variables behave like let in hoisting and temporal dead zone.

Like let, const variables are hoisted but not initialized. Accessing them before declaration causes a ReferenceError.

🧠 Conceptual

expert

Why does this code produce 'undefined' instead of error?

Consider this code:

console.log(x);
var x = 7;

Why does it print undefined instead of throwing an error?

A Because var declarations are hoisted and initialized with undefined before code runs

B Because the assignment happens before the console.log

C Because console.log ignores errors for var variables

D Because JavaScript treats undeclared variables as undefined automatically

💡 Hint

Think about what hoisting means for var variables.

Variables declared with var are hoisted to the top of their scope and initialized with undefined. So when console.log(x) runs, x exists but has the value undefined.