Prepare for Your JavaScript Interview with Basic, Intermediate, and Advanced Questions
Whether you’re a fresher, have 1-3 years of experience, or are a seasoned developer with 3-6 years in the field, these 30 JavaScript interview questions cover conceptual, practical, and scenario-based topics. Questions progress from basic to advanced to help you build confidence systematically.
Basic JavaScript Interview Questions (Freshers & 1-3 Years Experience)
1. What are the primitive data types in JavaScript?
JavaScript has seven primitive data types: String, Number, Boolean, Null, Undefined, Symbol, and BigInt. These are immutable basic values.[1][4]
2. Explain the difference between null and undefined.
Null represents an intentional absence of value, while undefined means a variable has been declared but not assigned a value. Typeof null returns “object” (historical bug), while typeof undefined returns “undefined”.[1][4]
3. What is hoisting in JavaScript?
Hoisting moves variable and function declarations to the top of their scope before code execution. Only declarations are hoisted, not initializations. Var is hoisted with undefined, let/const cause ReferenceError in TDZ.[4]
4. What are truthy and falsy values in JavaScript?
Falsy values are false, 0, 0n, -0, “”, null, undefined, NaN. All others are truthy. Use in if statements or logical operators like || and &&.[4]
5. How do you create an object in JavaScript?
Use object literal, Object constructor, Object.create(), or ES6 class syntax. Object literal is most common for simple objects.
const person = { name: 'John', age: 30 };
const person2 = new Object();
person2.name = 'Jane';[5]
6. What is the difference between == and ===?
== performs type coercion before comparison, === checks value and type strictly without coercion. Always prefer === for reliable comparisons.[1]
7. What does the typeof operator return for null?
typeof null returns “object” due to a historical bug in JavaScript, though null is a primitive value.[4][6]
8. Explain var, let, and const differences.
var is function-scoped and hoisted, let/const are block-scoped. const cannot be reassigned but allows mutation of objects/arrays. let allows reassignment.[3][4]
9. How do you remove duplicates from an array?
Use Set constructor or filter with indexOf. Set is modern and efficient.
const arr = [1, 2, 2, 3];
const unique = [...new Set(arr)]; // [1, 2, 3][1]
10. What is the difference between Array.slice() and Array.splice()?
slice() returns a shallow copy without modifying original. splice() modifies original array by adding/removing elements.[1]
Intermediate JavaScript Interview Questions (1-3 Years Experience)
11. What is a closure in JavaScript?
A closure is a function that retains access to its outer scope even after the outer function executes. Used for data privacy and function factories.[7]
12. Explain Promises in JavaScript.
Promises represent eventual completion/failure of async operations with states: pending, fulfilled, rejected. Use .then(), .catch(), .finally().[1]
13. What is the spread operator and its uses?
… spreads iterable elements. Used for array/object copying, function arguments, merging.
const arr1 = [1, 2];
const arr2 = [...arr1, 3]; // [1, 2, 3]
const obj = { ...{a: 1}, b: 2 };[1]
14. What is event bubbling and capturing?
Bubbling: events propagate from target up to root. Capturing: from root down to target. Use addEventListener(event, handler, true) for capture.[7]
15. How does this keyword work in JavaScript?
this refers to execution context. Global: window object. Arrow functions inherit from parent. Object method: the object. Use bind/call/apply to control.[7]
16. What is strict mode in JavaScript?
“use strict” enables stricter parsing/rules, catches common errors, prevents undeclared variables. Add at function/script top.[4]
17. Explain shallow copy vs deep copy.
Shallow copy copies top-level properties (references nested objects). Deep copy clones all levels recursively. Use JSON.parse(JSON.stringify()) or libraries.[1]
18. What are arrow functions and their limitations?
() => {} concise syntax, lexically binds this. No own this/arguments/super/new. Ideal for callbacks, not object methods.[2]
19. How do you debounce a function?
Debouncing delays function execution until after wait time elapses since last call. Useful for search inputs, scroll events.
function debounce(fn, delay) {
let timer;
return (...args) => {
clearTimeout(timer);
timer = setTimeout(() => fn(...args), delay);
};
}[5]
20. What is the Fetch API?
Modern replacement for XMLHttpRequest. Promise-based for HTTP requests. Handles GET/POST easily with JSON support.[2]
Advanced JavaScript Interview Questions (3-6 Years Experience)
21. What is a Proxy object?
Proxy wraps object, intercepts operations like get/set. Used for validation, logging, reactive systems.
const target = { a: 1 };
const handler = { get: (t, prop) => t[prop] ?? 'default' };
const proxy = new Proxy(target, handler);[7]
22. Explain async/await vs Promises.
async/await is syntactic sugar over Promises. async marks function returning Promise. await pauses until Promise settles. Cleaner error handling with try/catch.[2][3]
23. What is the Temporal Dead Zone (TDZ)?
Period from entering block scope until let/const declaration initialized. Accessing causes ReferenceError. Prevents hoisting misuse.[4]
24. How would you implement throttling in JavaScript?
Throttling limits execution to once per time interval. Opposite of debounce.
function throttle(fn, limit) {
let inThrottle;
return (...args) => {
if (!inThrottle) {
fn(...args);
inThrottle = true;
setTimeout(() => inThrottle = false, limit);
}
};
}[5]
25. Explain prototypal inheritance.
Objects inherit from prototypes via [[Prototype]] chain. Object.prototype is root. Use Object.create() or class extends.[5][7]
26. At Atlassian, how would you handle memory leaks in a long-running JavaScript app?
Monitor with Chrome DevTools heap snapshots. Fix by removing event listeners, clearing timers/intervals, avoiding closure memory traps, using WeakMap for caches.[7]
27. What are generators and how do they work?
function* yields multiple values via iterator. Pauses/resumes execution. Used for async flows pre-async/await.
function* gen() {
yield 1;
yield 2;
}
const iterator = gen();
console.log(iterator.next()); // {value: 1, done: false}[7]
28. Explain Symbol and its use cases.
Primitive for unique keys. Prevents property name collisions. Symbol.iterator for custom iterables.[4]
29. How do you implement error boundaries in vanilla JavaScript?
Use try/catch for sync code. window.onerror for global uncaught. Custom error handler with Promise rejection tracking.
window.onerror = (msg, url, line) => {
console.error('Global error:', msg);
return true;
};[3]
30. In a Swiggy-like real-time order tracking app at Paytm, how would you optimize event handling for high-frequency updates?
Combine requestAnimationFrame for DOM updates, debounce/throttle handlers, use document delegation for dynamic elements, Virtual DOM patterns or efficient diffing.[2][5]
