JavaScript Interview Questions: 20 Essential Questions Every Developer Must Know (Answers & Examples)
If you’re preparing for a developer role, you’ve probably searched for JavaScript interview questions at some point. One thing you’ll quickly notice is that interviewers rarely start with advanced topics like generators, proxies, or complex design patterns. Instead, they focus on the fundamentals to see how well you understand the language.
Why? Because a strong foundation in JavaScript is often a better indicator of your coding ability than memorizing advanced concepts. Developers who understand the basics tend to write cleaner code, debug problems more efficiently, and pick up frameworks like React, Angular, Vue, and Node.js much faster.
In this guide, we’ve compiled 20 essential JavaScript interview questions that are commonly asked in technical interviews. These questions cover the core concepts every JavaScript developer should know. Rather than simply memorizing the answers, take the time to understand the reasoning behind each concept—doing so will help you perform better in interviews and become a more confident developer.
Table of Contents
1. What is the difference between var, let, and const?
This is probably the most common JavaScript interview question—and for good reason. Understanding variable declarations is essential.
var
- Function scoped
- Can be redeclared
- Can be reassigned
- Hoisted and initialized with
undefined
var name = "John";
var name = "Mike"; // Valid
let
- Block scoped
- Cannot be redeclared in the same scope
- Can be reassigned
- Hoisted but remains in the Temporal Dead Zone until initialized
let age = 25;
age = 26; // Valid
const
- Block scoped
- Cannot be redeclared
- Cannot be reassigned
- Must be initialized during declaration
const PI = 3.14159;
Interview Tip:
constprevents reassignment, not mutation. A constant object can still have its properties modified.
const user = {
name: "John"
};
user.name = "Mike"; // Valid
2. What are the different data types in JavaScript?
JavaScript data types are divided into two categories.
Primitive Types
- String
- Number
- Boolean
- Undefined
- Null
- Symbol
- BigInt
Example:
let name = "Alice";
let age = 22;
let isStudent = true;
let salary = null;
let city;
Non-Primitive Types
Everything else falls under objects.
Examples include:
- Object
- Array
- Function
- Date
- Map
- Set
3. What is the difference between == and ===?
Many beginners confuse these two operators.
Loose Equality (==)
Performs type conversion before comparison.
5 == "5"; // true
true == 1; // true
Strict Equality (===)
Compares both value and type.
5 === "5"; // false
5 === 5; // true
In modern JavaScript, always prefer === unless you intentionally want type coercion.
4. What is Hoisting?
Hoisting is JavaScript’s behavior of moving declarations to the top of their scope before execution.
Consider this:
console.log(name);
var name = "John";
JavaScript internally treats it like this:
var name;
console.log(name);
name = "John";
Output:
undefined
Now compare that with let.
console.log(age);
let age = 25;
This throws an error because of the Temporal Dead Zone.
5. What is the Temporal Dead Zone (TDZ)?
The TDZ is the period between entering a scope and initializing a let or const variable.
console.log(score);
let score = 100;
Output:
ReferenceError
Even though the variable is hoisted, it cannot be accessed before initialization.
6. What is the difference between null and undefined?
These two are often mistaken as the same.
Undefined
Means a variable has been declared but not assigned a value.
let country;
console.log(country);
Output:
undefined
Null
Represents an intentional absence of value.
let response = null;
Think of it this way:
undefined→ JavaScript doesn’t know the value.null→ You intentionally set it to “no value.”
7. What is the difference between Function Declaration and Function Expression?
Function Declaration
function greet() {
console.log("Hello");
}
Can be called before it’s declared due to hoisting.
Function Expression
const greet = function () {
console.log("Hello");
};
Cannot be used before its definition.
8. What are Arrow Functions?
Arrow functions were introduced in ES6 to provide shorter syntax.
Traditional function:
function add(a, b) {
return a + b;
}
Arrow function:
const add = (a, b) => a + b;
Important differences include:
- No own
this - No own
arguments - Cannot be used as constructors
- Shorter syntax
9. What is the this keyword?
this refers to the object that is executing the current function.
Example:
const user = {
name: "John",
greet() {
console.log(this.name);
}
};
user.greet();
Output:
John
The value of this changes depending on how a function is called, making it one of the most important concepts in JavaScript.
10. What are Truthy and Falsy Values?
JavaScript converts values to true or false in conditional statements.
Falsy values are:
false
0
-0
""
null
undefined
NaN
Everything else is considered truthy.
11. What is the difference between map(), filter(), and forEach()?
Although these methods look similar, they serve different purposes.
map()
Creates a new array.
const doubled = [1,2,3].map(num => num * 2);
Output:
[2,4,6]
filter()
Returns elements matching a condition.
const even = [1,2,3,4].filter(num => num % 2 === 0);
Output:
[2,4]
forEach()
Simply loops through elements.
numbers.forEach(num => console.log(num));
It does not return a new array.
12. What is the difference between slice() and splice()?
Many candidates mix these up.
slice()
- Doesn’t modify the original array
- Returns a portion
const arr = [1,2,3,4];
arr.slice(1,3);
Output:
[2,3]
splice()
- Modifies the original array
- Can remove or insert elements
13. What is a Callback Function?
A callback is simply a function passed as an argument to another function.
Example:
setTimeout(() => {
console.log("Hello");
}, 1000);
The arrow function executes after one second.
Callbacks are widely used in asynchronous programming.
14. What are Closures?
Closures are among the most frequently asked interview topics.
Example:
function counter() {
let count = 0;
return function () {
count++;
return count;
};
}
const increment = counter();
console.log(increment());
console.log(increment());
console.log(increment());
Output:
1
2
3
The inner function continues to access variables from its outer scope even after the outer function has finished executing.
15. What is Scope?
Scope determines where variables can be accessed.
JavaScript has:
- Global Scope
- Function Scope
- Block Scope
Understanding scope helps prevent accidental bugs and variable conflicts.
16. What is Event Bubbling?
When an event occurs on a child element, it first runs on the child and then propagates upward.
Button
↑
Div
↑
Body
↑
Document
JavaScript also supports Event Capturing, which is the opposite direction.
17. What is the difference between Synchronous and Asynchronous JavaScript?
Synchronous
Runs line by line.
console.log(1);
console.log(2);
console.log(3);
Output:
1
2
3
Asynchronous
Some operations execute later without blocking the rest of the program.
console.log(1);
setTimeout(() => {
console.log(2);
}, 1000);
console.log(3);
Output:
1
3
2
18. What are Promises?
Promises represent the eventual completion or failure of an asynchronous operation.
They have three states:
- Pending
- Fulfilled
- Rejected
Example:
fetch(url)
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error))
.finally(() => console.log("Done"));
Promises make asynchronous code much cleaner than nested callbacks.
19. What is the difference between Promises and async/await?
async/await is built on top of promises.
Promise style:
fetch(url)
.then(...)
.catch(...);
Async/Await style:
async function getUsers() {
try {
const response = await fetch(url);
const users = await response.json();
console.log(users);
} catch (error) {
console.log(error);
}
}
Both achieve the same result, but async/await often makes asynchronous code easier to read and maintain.
20. What is the difference between localStorage, sessionStorage, and Cookies?
These are all used for storing data in the browser, but they behave differently.
| Feature | localStorage | sessionStorage | Cookies |
|---|---|---|---|
| Lifetime | Permanent | Until browser tab closes | Configurable |
| Storage Limit | Around 5–10 MB | Around 5 MB | Around 4 KB |
| Sent with HTTP Requests | No | No | Yes |
| Typical Use Case | User preferences, themes | Temporary session data | Authentication, session management |
Choosing the right storage mechanism depends on what kind of data you’re storing and how long it needs to persist.
Final Thoughts on JavaScript Interview Questions
JavaScript interviews don’t just test whether you can write code—they test whether you understand how the language behaves under the hood. Many developers jump straight into learning frameworks like React, Angular, or Vue without fully grasping the fundamentals. That often leads to confusion when debugging or answering interview questions.
If you can confidently explain the concepts covered in this article, write small examples without looking them up, and understand the reasoning behind each answer, you’ll be well-prepared for most JavaScript interviews.
As a next step, don’t stop at reading. Open your editor, experiment with each concept, break the code, and observe how JavaScript behaves. That’s where real understanding begins.
Good luck with your interviews, and happy coding!
Additional JavaScript Learning Resources
Mastering the concepts covered in these JavaScript interview questions is a great start, but continuous learning is what makes you a better developer. If you’d like to dive deeper into JavaScript and explore the language in more detail, the following resources are highly recommended by developers worldwide.
- MDN Web Docs (JavaScript)
https://developer.mozilla.org/en-US/docs/Web/JavaScript
The official and most trusted JavaScript documentation. It provides in-depth explanations, API references, and practical examples for developers of all skill levels. - JavaScript.info
https://javascript.info/
One of the best free resources for learning modern JavaScript from the ground up. It covers everything from the fundamentals to advanced topics with interactive examples. - ECMAScript Language Specification (ECMA-262)
https://tc39.es/ecma262/
The official JavaScript language specification. While it’s more technical, it’s the definitive source for understanding how JavaScript works under the hood. - Node.js Official Documentation
https://nodejs.org/
If you’re planning to use JavaScript on the server side, the official Node.js documentation is an excellent resource for learning its APIs, modules, and best practices.
Exploring these resources alongside practicing the JavaScript interview questions in this guide will strengthen your understanding of the language and help you become a more confident developer.