JavaScript Interview Practice Questions with solutions

Introductions

JavaScript interviews often test more than syntax. Interviewers want to know whether you understand how JavaScript works, how to solve problems, and why your code behaves in a particular way.

This chapter covers practical JavaScript interview questions from beginner to intermediate level. Each question includes a simple solution, output, and step-by-step explanation so you can prepare with confidence. JavaScript Interview practice questions with solutions help to build concepts.

Question 1: What Is the Difference Between `let`, `const`, and `var`?

Problem

Explain the difference between var, let, and const with an example.

Solution

var name = "Rahul";

let age = 20;

const country = "India";

console.log(name);
console.log(age);
console.log(country);

Output

Rahul
20
India

Step-by-step Explanation

var is the older way of declaring variables.

var name = "Rahul";

let is used when the value may change:

let age = 20;

age = 21;

const is used when the variable should not be reassigned:

const country = "India";

You cannot do:

country = "USA";

A simple rule for beginners is:

let   → value can be reassigned
const → value should not be reassigned
var   → older syntax, usually avoid in modern JavaScript

Question 2: What Is the Difference Between `==` and `===`?

Problem

Predict the output of this code:

console.log(5 == "5");
console.log(5 === "5");

Solution

console.log(5 == "5");
console.log(5 === "5");

Output

true
false

Step-by-step Explanation

== checks equality after allowing type conversion.

5 == "5"

JavaScript converts the string "5" into a number, so the result is:

true

=== checks both value and type.

5 === "5"

Here:

5     → number
"5"   → string

Therefore:

false

In modern JavaScript, prefer === and !== unless you specifically need loose equality.

Question 3: What Is Hoisting?

Problem

What happens when this code runs?

console.log(name);

var name = "JavaScript";

Solution

console.log(name);

var name = "JavaScript";

Output

undefined

Step-by-step Explanation

Declarations made with var are hoisted to the top of their function scope.

Conceptually, JavaScript behaves somewhat like:

var name;

console.log(name);

name = "JavaScript";

At the time of the console.log(), the variable exists but has not received the value "JavaScript".

Therefore:

undefined

Important: let and const are also hoisted in the language specification, but they cannot be accessed before their declaration because they are in the temporal dead zone (TDZ).

Question 4: What Is the Difference Between `null` and `undefined`?

Problem

Understand the difference between null and undefined.

Solution

let user;

let selectedUser = null;

console.log(user);
console.log(selectedUser);

Output

undefined
null

Step-by-step Explanation

When a variable has been declared but no value has been assigned:

let user;

its value is:

undefined

null is intentionally assigned to represent an empty or missing value:

let selectedUser = null;

Think of it as:

undefined → value has not been assigned
null      → intentionally no value

Question 5: What Is a Closure?

Problem

Create a function that remembers a variable even after the outer function has finished executing.

Solution

function createCounter() {

    let count = 0;

    return function() {
        count++;
        return count;
    };
}

const counter = createCounter();

console.log(counter());
console.log(counter());
console.log(counter());

Output

1
2
3

Step-by-step Explanation

The outer function creates:

let count = 0;

It then returns an inner function:

return function() {
    count++;
    return count;
};

The inner function remembers access to count.

So even after createCounter() has finished, the returned function can still access:

count

This behavior is called a closure.

Closures are commonly used for:

Private state
Counters
Function factories
Callbacks
Data encapsulation

Question 6: What Is the Difference Between `map()` and `filter()`?

Problem

Create a new array containing the squares of numbers greater than 2.

Solution

const numbers = [1, 2, 3, 4, 5];

const result = numbers
    .filter(function(number) {
        return number > 2;
    })
    .map(function(number) {
        return number * number;
    });

console.log(result);

Output

[9, 16, 25]

Step-by-step Explanation

First, filter() selects numbers greater than 2:

3
4
5

Then map() transforms them:

3 × 3 = 9
4 × 4 = 16
5 × 5 = 25

So the final result is:

[9, 16, 25]

Remember:

filter() → selects elements
map()    → transforms elements

Question 7: What Is the `this` Keyword?

Problem

What does this refer to in the following object method?

Solution

const user = {

    name: "Riya",

    greet: function() {
        console.log("Hello " + this.name);
    }

};

user.greet();

Output

Hello Riya

Step-by-step Explanation

Inside the method:

this.name

this refers to the object that called the method.

Here:

user.greet();

So:

this → user

Therefore:

this.name

is equivalent to:

user.name

and produces:

Hello Riya

The exact behavior of this depends on how a function is called, so it is an important JavaScript interview topic.

Question 8: What Is a Promise?

Problem

Create a Promise that resolves successfully after a short delay.

Solution

const promise = new Promise(function(resolve, reject) {

    setTimeout(function() {
        resolve("Data loaded successfully");
    }, 1000);

});

promise.then(function(message) {
    console.log(message);
});

Output

After approximately one second:

Data loaded successfully

Step-by-step Explanation

A Promise represents the eventual result of an asynchronous operation.

It can be:

Pending
Fulfilled
Rejected

Here:

resolve("Data loaded successfully");

marks the Promise as fulfilled.

The .then() method handles the successful result:

promise.then(function(message) {
    console.log(message);
});

Promises are commonly used with:

API requests
Fetch
Database operations
Timers
Asynchronous tasks

Question 9: What Is the Difference Between Synchronous and Asynchronous JavaScript?

Problem

Understand the output of this program.

Solution

console.log("Start");

setTimeout(function() {
    console.log("Timer");
}, 0);

console.log("End");

Output

Start
End
Timer

Step-by-step Explanation

You might expect "Timer" to appear immediately because the delay is 0.

But setTimeout() schedules its callback to run later.

JavaScript first executes:

console.log("Start");

Then it schedules the timer.

Then it executes:

console.log("End");

After the current synchronous code finishes, the timer callback can run.

Therefore:

Start
End
Timer

This introduces an important JavaScript concept: the event loop.

Question 10: What Is Event Delegation?

Problem

Use one event listener on a parent element to handle clicks on multiple list items.

Solution

<ul id="menu">
    <li>Home</li>
    <li>About</li>
    <li>Contact</li>
</ul>

<script>
    const menu = document.getElementById("menu");

    menu.addEventListener("click", function(event) {

        if (event.target.tagName === "LI") {
            console.log(
                "You clicked: " +
                event.target.textContent
            );
        }

    });
</script>

Output

If the user clicks About:

You clicked: About

If the user clicks Contact:

You clicked: Contact

Step-by-step Explanation

Instead of adding an event listener to every <li>, we add one listener to the parent:

menu.addEventListener("click", function(event) {

The clicked element is available through:

event.target

Then we check whether the clicked element is an <li>:

event.target.tagName === "LI"

This technique is called event delegation.

It is particularly useful when:

There are many child elements.
Elements are created dynamically.
You want fewer event listeners.

Key Takeaways

let, const, and var have different behaviors.
Prefer const by default and use let when reassignment is needed.
=== checks both value and type.
== performs type coercion.
undefined and null represent different situations.
Hoisting is an important JavaScript behavior.
Closures allow functions to remember variables from their outer scope.
map() transforms array elements.
filter() selects array elements.
this depends on how a function is called.
Promises are used to handle asynchronous operations.
async/await provides another way to work with Promises.
JavaScript uses an event loop to coordinate asynchronous callbacks.
Event delegation allows a parent element to handle events from its children.
Interview questions often test your understanding rather than your ability to memorize syntax.
Always explain why your code produces a particular output.

FAQs

1. What JavaScript topics are commonly asked in interviews?

Common JavaScript interview topics include:

Variables
Data types
Scope
Hoisting
Closures
Functions
Arrow functions
this
Objects
Arrays
Array methods
DOM
Events
Promises
Async/await
Fetch API
Event loop
Prototypes
Classes
Modules

2. Is JavaScript difficult for interviews?

JavaScript interviews can become challenging when questions involve concepts such as closures, scope, this, asynchronous code, and the event loop.

The best approach is to understand the behavior instead of memorizing answers.

3. What should I study before a JavaScript interview?

Make sure you understand the fundamentals first:

Variables
↓
Data Types
↓
Operators
↓
Conditions
↓
Loops
↓
Functions
↓
Arrays
↓
Objects
↓
DOM
↓
Events
↓
Async JavaScript

Then move to advanced concepts such as closures, prototypes, modules, and the event loop.

4. Why do JavaScript interviewers ask output-based questions?

Output questions test whether you understand how JavaScript executes code.

For example:

console.log(5 + "5");

The result is:

Understanding type coercion is more useful than simply memorizing the answer.

5. Should beginners practice coding questions for JavaScript interviews?

Yes.

Start with simple problems involving:

Strings
Arrays
Numbers
Loops
Conditions
Objects

Then move to:

Array methods
DOM problems
Asynchronous JavaScript
Closures
Event handling

6. How can I explain my JavaScript answer in an interview?

Use a simple structure:

1. Explain your approach.
2. Write the solution.
3. Explain important lines.
4. Mention the expected output.
5. Discuss edge cases if necessary.

This shows the interviewer that you understand the problem instead of simply remembering code.

7. What is the most important JavaScript interview advice?

Don’t only practice writing code.

Practice explaining why the code works.

For example, don’t just say:

The output is 3.

Explain:

The function keeps the count variable inside its closure,
so each call remembers the previous value.

That type of explanation demonstrates real understanding.

Written by Shubhranshu Shekhar, who has trained 20000+ students in coding.

Rishabh Kumar

Introductions

Question 1: What Is the Difference Between let, const, and var?

Problem

Solution

Output

Step-by-step Explanation

Question 2: What Is the Difference Between == and ===?

Problem

Solution

Output

Step-by-step Explanation

Question 3: What Is Hoisting?

Problem

Solution

Output

Step-by-step Explanation

Question 4: What Is the Difference Between null and undefined?

Problem

Solution

Output

Step-by-step Explanation

Question 5: What Is a Closure?

Problem

Solution

Output

Step-by-step Explanation

Question 6: What Is the Difference Between map() and filter()?

Problem

Solution

Output

Step-by-step Explanation

Question 7: What Is the this Keyword?

Problem

Solution

Output

Step-by-step Explanation

Question 8: What Is a Promise?

Problem

Solution

Output

Step-by-step Explanation

Question 9: What Is the Difference Between Synchronous and Asynchronous JavaScript?

Problem

Solution

Output

Step-by-step Explanation

Question 10: What Is Event Delegation?

Problem

Solution

Output

Step-by-step Explanation

Key Takeaways

FAQs

1. What JavaScript topics are commonly asked in interviews?

2. Is JavaScript difficult for interviews?

3. What should I study before a JavaScript interview?

4. Why do JavaScript interviewers ask output-based questions?

5. Should beginners practice coding questions for JavaScript interviews?

6. How can I explain my JavaScript answer in an interview?

7. What is the most important JavaScript interview advice?

Related Posts

Question 1: What Is the Difference Between `let`, `const`, and `var`?

Question 2: What Is the Difference Between `==` and `===`?

Question 4: What Is the Difference Between `null` and `undefined`?

Question 6: What Is the Difference Between `map()` and `filter()`?

Question 7: What Is the `this` Keyword?