JavaScript tricky question and answer part-2

Umar Farooque Khan
5 min readOct 21, 2023

--

Certainly! Engaging with challenging JavaScript questions sharpens your grasp of essential concepts. This question will push your understanding, requiring a solid foundation in JavaScript to craft an effective solution. Happy coding!

Question :

Consider the following code snippet:

What will be the output of this code, and why?

Explanation:

This code snippet demonstrates a common JavaScript behavior called variable hoisting. In JavaScript, variable declarations are hoisted to the top of their scope, but their assignments remain in place.

When the example() function is called, it first tries to log the value of a. Inside the function, there's a var a = 20; statement, which creates a new local variable a within the function scope. However, due to hoisting, the declaration of var a; is hoisted to the top of the function, effectively making the function equivalent to:

Therefore, when console.log(a) is executed inside the function, the local variable a is declared but not yet assigned, so its value is undefined. Consequently, the output of the code will be:

Output:

This question underscores the significance of comprehending variable hoisting and discerning the distinction between variable declaration and assignment in JavaScript. It emphasizes the critical nuances that can greatly impact code execution and highlights the necessity of mastering these fundamental concepts for proficient programming in JavaScript.

Question:

Consider the following code snippet:

Explanation:

This question explores variable hoisting and the behavior of variables declared with var inside blocks.

In the trickyExample() function, there's a console.log(a) statement before and after the if block. Inside the block, there's a var a = 10; declaration. Due to variable hoisting, the declaration var a; is hoisted to the top of the function scope, making it accessible throughout the function.

However, in JavaScript, variables declared with var inside blocks are not block-scoped; they are function-scoped. This means that the variable a declared inside the if block is accessible throughout the trickyExample() function, even before the if block.

When trickyExample() is called, the first console.log(a) statement will output undefined because a is hoisted but not yet assigned a value. The second console.log(a) statement will output 10 because a has been assigned the value 10 inside the if block.

The output of the code will be:

This question tests your comprehension of variable hoisting and function scope concepts in JavaScript.

Question:

Consider the following code snippet:

Explanation:

This question explores the differences between variables declared with var and let inside blocks in JavaScript.

In the trickyFunction(), there's an if block containing both var a = 5; and let b = 10; declarations. Variables declared with var are function-scoped and are hoisted to the top of the function, whereas variables declared with let are block-scoped and are not hoisted.

When trickyFunction() is called, var a is hoisted to the top of the function and is accessible throughout the function. However, let b is block-scoped and only accessible within the if block.

The first console.log(a) statement will output 5 because var a is accessible within the entire trickyFunction() function due to hoisting.

The second console.log(b) statement will result in a ReferenceError because let b is block-scoped to the if block and is not accessible outside of it.

Output:

Question:

Consider the following code snippet:

Explanation:

  • var a = 5; is function-scoped and hoisted, making it accessible throughout the function. It logs 5.
  • let b = 10; is block-scoped and only accessible within the if block where it's declared. Attempting to access it outside the block results in an error. The try-catch block handles the error, indicating that "Variable 'b' is not accessible."

Output:

Question:

Consider the following code snippet:

In the given code, a variable variable is declared and assigned 10. Inside an immediately invoked function expression (IIFE), the same variable is re-declared with var and assigned 20. Due to hoisting, the first console.log(variable) prints undefined (the variable is declared but not yet assigned), and the second console.log(variable) prints 20. This demonstrates the impact of hoisting and variable re-declaration in JavaScript.

Question:

What will be the output of the following code?

The code starts with a global variable a set to 1. Inside function b(), a local function a is declared, which temporarily shadows the global a. b() assigns 10 to the local a, but it doesn't affect the global one. The console.log(a) statement prints the unchanged global a, resulting in the output 1.

Output:

Here are some additional high-quality tutorials for you to explore:

  1. JavaScript interview Question and Answer
  2. Node Js Interview Question and Answer
  3. JavaScript Tricky Question
  4. JavaScript Array Interview Questions

--

--

Umar Farooque Khan
Umar Farooque Khan

Written by Umar Farooque Khan

Experienced software developer with a passion for clean code and problem-solving. Full-stack expertise in web development. Lifelong learner and team player.

No responses yet