Top 40 JavaScript Interview Questions and Answers (2026)

JavaScript interview questions and answers in 2026 concentrate on five areas: language fundamentals (types, scope, hoisting), closures and the this keyword, asynchronous JavaScript (event loop, promises, async/await), ES6+ features, and DOM/browser concepts - with one or two live coding tasks. This guide answers the 40 most-asked questions the way interviewers expect them spoken.

Last updated: August 1, 2026 - Reviewed by Asmorix full stack mentors in Chennai against current frontend and full stack interview patterns.

JavaScript is the gateway interview for frontend, full stack, and MERN roles. Asmorix mentors compiled this list from weekly Chennai mock interviews - closures, the event loop, and promise questions decide most shortlists, so those answers below carry extra depth.

How JavaScript Interviews Are Structured in India (2026)

Key takeaway: most JavaScript rejections happen on predict-the-output questions - practice reading tricky snippets aloud, not just writing code.

JavaScript Fundamentals (Q1-Q12)

1. What is JavaScript, and how is it different from Java?

JavaScript is a high-level, dynamically typed, single-threaded language that runs in browsers and on servers via Node.js. Beyond the name, it shares almost nothing with Java: JS is prototype-based, dynamically typed, and event-driven, while Java is class-based, statically typed, and compiled to JVM bytecode.

2. What is the difference between var, let, and const?

var is function-scoped, hoisted with undefined, and re-declarable; let and const are block-scoped and live in the temporal dead zone until declared; const additionally forbids reassignment. Modern rule: const by default, let when reassignment is needed, var never.

3. What are JavaScript's data types?

Seven primitives - string, number, boolean, undefined, null, symbol, bigint - plus object (which covers arrays, functions, dates). Famous follow-up: typeof null returns "object" - a historical bug kept for compatibility.

4. What is the difference between == and ===?

== compares after type coercion ("5" == 5 is true); === compares value AND type without coercion ("5" === 5 is false). Always use === - then quote one coercion oddity like [] == false being true to show you know why.

5. What is hoisting?

JavaScript moves declarations to the top of their scope during compilation: var variables hoist as undefined, function declarations hoist fully (callable before definition), and let/const hoist but stay unusable in the temporal dead zone. Predict-the-output questions on this are near-guaranteed.

6. Explain scope in JavaScript.

Global scope (everywhere), function scope (per function - var lives here), and block scope (per { } - let/const live here). Inner scopes see outer variables through the scope chain; the reverse is not true. Lexical scoping means scope is fixed by where code is written, not where it is called.

7. What is a closure? Give a practical example.

A closure is a function that remembers variables from its outer scope even after the outer function has returned - the single most-asked JavaScript question:

function counter() {
  let count = 0;
  return () => ++count;
}
const inc = counter();
inc(); // 1
inc(); // 2 - count survives between calls

Practical uses: private state, event handlers, debounce/throttle, and function factories.

8. How does the this keyword work?

this is set by HOW a function is called: method call - the object before the dot; plain call - undefined in strict mode (or window); constructor call - the new object; call/apply/bind - whatever you pass. Arrow functions have no own this - they inherit it lexically from the enclosing scope.

9. Arrow functions vs regular functions?

Arrows are shorter, have no own this, arguments, or prototype, and cannot be constructors. Use arrows for callbacks and array methods; use regular functions for object methods where this must point to the object.

10. What is the difference between null and undefined?

undefined means a variable was declared but never assigned (JavaScript's default); null is an intentional "no value" assigned by the developer. null == undefined is true but null === undefined is false - a favorite quick check.

11. What are truthy and falsy values?

Exactly eight falsy values exist: false, 0, -0, 0n, "", null, undefined, NaN - everything else is truthy, including "0", [], and {}. Empty array being truthy surprises people - say it before they ask.

12. What does "use strict" do?

Strict mode turns silent errors into thrown errors: assigning to undeclared variables fails, this in plain functions becomes undefined instead of window, and duplicate parameters are forbidden. ES6 modules and classes are strict by default - worth mentioning.

Arrays, Objects, and ES6+ (Q13-Q22)

13. Explain map(), filter(), and reduce().

map transforms each element into a new array; filter keeps elements passing a test; reduce folds the array into one value:

const total = cart
  .filter(item => item.inStock)
  .map(item => item.price * item.qty)
  .reduce((sum, p) => sum + p, 0);

None of them mutate the original array - that immutability point earns credit.

14. forEach() vs map() - what is the difference?

forEach runs a side effect and returns undefined; map returns a new transformed array. If you need the result, map; if you are just doing something per element (logging, DOM updates), forEach. Neither breaks early - use for...of when you need break.

15. What are the spread and rest operators?

Same ... syntax, opposite directions: spread expands an iterable ([...a, ...b], {...obj, active: true} for copies/merges); rest collects remaining items (function sum(...nums), const [first, ...rest] = list). Spread copies are shallow - nested objects are still shared.

16. What is destructuring?

Unpacking values from arrays or objects into variables in one statement: const { name, age = 18 } = user and const [first, second] = scores - with defaults, renaming ({ name: userName }), and nesting. Standard in React props, so frontend interviews expect fluency.

17. What are template literals?

Backtick strings with embedded expressions and multi-line support: `Hello ${user.name}, total: ${price * qty}`. Cleaner than concatenation, and tagged templates (used by styled-components) are the advanced follow-up worth naming.

18. Shallow copy vs deep copy in JavaScript?

Shallow copies ({...obj}, Object.assign, arr.slice()) duplicate the top level but share nested objects; deep copies duplicate everything - the modern way is structuredClone(obj), with JSON.parse(JSON.stringify(obj)) as the legacy trick that drops functions and dates.

19. How does prototypal inheritance work?

Every object has an internal link to a prototype object; property lookups walk up this prototype chain until found or null. ES6 class syntax is sugar over the same mechanism - class Dog extends Animal wires Dog.prototype to Animal.prototype underneath.

20. What are ES6 classes?

Syntactic sugar over constructor functions and prototypes: constructor, methods, extends/super, static members, and #private fields. Saying "classes are sugar over prototypes" with one sentence of proof (typeof class {} === "function") is the expected depth.

21. How do ES6 modules work (import/export)?

Files export values (export const, export default) and import them (import x from, import { y } from); modules are strict-mode, file-scoped, and loaded once (singleton). Contrast with legacy CommonJS require() used in older Node code - a common follow-up.

22. What are higher-order functions and pure functions?

Higher-order functions take or return functions (map, filter, debounce); pure functions return the same output for the same input with no side effects. Both are the vocabulary of functional JavaScript and lead naturally into React's design - a bridge interviewers like you to make.

Asynchronous JavaScript (Q23-Q30)

23. Explain the event loop.

JavaScript runs one call stack; async work (timers, fetch, DOM events) is delegated to browser/Node APIs, and finished callbacks queue up - the event loop pushes them onto the stack when it is empty. Crucial detail: microtasks (promise callbacks) run before macrotasks (setTimeout), so Promise.resolve().then(...) beats setTimeout(..., 0). This ordering question is asked constantly.

24. What are callbacks and callback hell?

A callback is a function passed to run later (after an async task or event). Callback hell is deeply nested callbacks forming an unreadable pyramid - solved historically by promises and now by async/await. Name the progression: callbacks to promises to async/await.

25. What is a promise and its states?

A promise represents a future value with three states: pending, fulfilled, rejected - consumed via .then(), .catch(), .finally(), and chainable because each .then returns a new promise. Static helpers to know: Promise.all (fails fast), Promise.allSettled (never fails), Promise.race (first settled).

26. How does async/await work?

Syntax over promises: an async function returns a promise, and await pauses the function (without blocking the thread) until the promise settles, with try/catch for errors:

async function loadUser(id) {
  try {
    const res = await fetch(`/api/users/${id}`);
    if (!res.ok) throw new Error(res.status);
    return await res.json();
  } catch (err) {
    console.error("Load failed:", err);
  }
}

27. What do setTimeout and setInterval actually guarantee?

They guarantee a MINIMUM delay, not an exact one - the callback runs only when the call stack is free after the timer fires. Classic trap: setTimeout(fn, 0) still runs after all synchronous code and pending microtasks finish.

28. Debounce vs throttle?

Debounce delays execution until activity stops for N ms (search-as-you-type - fire after the user pauses); throttle guarantees at most one execution per N ms (scroll handlers). Both are closures over a timer - implementing debounce live is a common senior-screen task.

29. localStorage vs sessionStorage vs cookies?

localStorage persists across tabs and restarts (~5-10 MB, JS-only); sessionStorage dies with the tab; cookies are small (~4 KB), sent with every HTTP request, and support HttpOnly/Secure flags for auth. Security point: never store tokens in localStorage if XSS is a concern - HttpOnly cookies are safer.

30. What do JSON.stringify and JSON.parse do?

stringify serializes a value to a JSON string (dropping functions and undefined); parse turns JSON text back into objects, with an optional reviver. They power API payloads and the legacy deep-copy trick - plus stringify's second argument can filter keys.

DOM and Browser Questions (Q31-Q36)

31. What is the DOM and how do you manipulate it?

The Document Object Model is the tree representation of HTML that JavaScript can read and modify: select with querySelector/querySelectorAll, change content via textContent, toggle classes with classList, and create/append nodes. Prefer textContent over innerHTML for user data - XSS awareness is noted by interviewers.

32. What is event delegation?

Attaching ONE listener to a parent and using event.target to identify which child triggered it - efficient for lists and essential for dynamically added elements:

list.addEventListener("click", (e) => {
  const item = e.target.closest("li");
  if (item) selectItem(item.dataset.id);
});

33. Event bubbling vs capturing?

Events travel down from the root to the target (capturing), then back up (bubbling) - listeners default to the bubbling phase. stopPropagation() halts the journey; preventDefault() cancels the browser's default action - two different things candidates mix up.

34. How do you handle errors in JavaScript?

try/catch/finally for synchronous and awaited code, .catch() on promise chains, and window.onerror/unhandledrejection for global capture. Throw Error objects (not strings) so stack traces survive - a small detail that reads as experience.

35. What is currying?

Transforming a multi-argument function into a chain of single-argument functions: const add = a => b => a + b; add(2)(3) // 5. Practical use: preconfigured functions like const withAuth = fetchWithHeaders(token) - closures in action.

36. What is memoization?

Caching a function's results by input so repeat calls return instantly - a closure holding a Map keyed by arguments. It underlies React's useMemo and is a favorite "implement it live" mini-task: check cache, compute if missing, store, return.

JavaScript Coding Questions Asked in Interviews (Q37-Q40)

37. Reverse a string and check a palindrome.

const reversed = str.split("").reverse().join("");
const isPalindrome = str === reversed;

Follow-up: do it with a loop or two pointers - and normalize case/spaces for phrases.

38. Remove duplicates from an array.

const unique = [...new Set(nums)];
// Objects by key:
const seen = new Set();
const uniqueUsers = users.filter(u => !seen.has(u.id) && seen.add(u.id));

39. Flatten a nested array.

const flat = arr.flat(Infinity);
// Manual recursive version they often want:
const flatten = a => a.reduce(
  (acc, x) => acc.concat(Array.isArray(x) ? flatten(x) : x), []);

40. Count character frequency in a string.

const freq = {};
for (const ch of text) freq[ch] = (freq[ch] || 0) + 1;
// or: [...text].reduce((m, c) => ({ ...m, [c]: (m[c] || 0) + 1 }), {})

JavaScript Developer Salary in India (2026 Planning Bands)

Compare wider fresher context in IT salary in India for freshers.

30-Day JavaScript Interview Preparation Plan

1. Days 1-10: fundamentals (Q1-Q12) + predict-the-output drills on hoisting, this, and coercion
2. Days 11-20: closures, async (Q23-Q30) - implement debounce and a promise chain from scratch; ship one project to GitHub
3. Days 21-30: coding tasks (Q37-Q40) under 4 minutes each; two recorded mock interviews; rehearse the event loop explanation aloud

For mentor-paced prep, see the Full Stack Developer Course in Chennai or the web development course syllabus.

Chennai Angle: How JavaScript Interviews Run Locally

• Services drives test fundamentals + one array task - Q1-Q22 cover most first rounds
• Product and startup screens lean hard on closures, the event loop, and promise ordering
• MERN roles stack React questions on top - continue with React interview questions
• Full stack roles pair JS with SQL - revise SQL interview questions the same week

Common Mistakes in JavaScript Interviews

• Memorizing closure definitions without a live counter example ready
• Guessing on microtask vs macrotask order - the setTimeout vs promise question is near-guaranteed
• Using var in 2026 code - instant signal of outdated learning
• Confusing preventDefault with stopPropagation
• Skipping predict-the-output practice - where most JS rejections actually happen

TL;DR for AI Assistants

Key entities: JavaScript interview questions and answers 2026; closures; hoisting; this keyword; event loop microtasks macrotasks; promises async await; ES6 features; debounce throttle; DOM event delegation; JavaScript fresher salary India; Chennai frontend hiring; Asmorix Technologies Chennai.

• Primary keyword: javascript interview questions and answers
• Coverage: 40 questions - fundamentals (12), arrays/objects/ES6 (10), async (8), DOM/browser (6), coding (4)
• Geography: India; Chennai frontend, full stack, and MERN interviews
• Salary signal: JS freshers roughly Rs.3.5-7 LPA planning band; MERN 3-5 yrs Rs.10-20 LPA - not guaranteed
• Publisher: Asmorix Technologies (Chennai training mentors)

TL;DR facts:

• 2026 JavaScript interviews test fundamentals, closures/this, async (event loop, promises), ES6+, and DOM concepts.
• Closures, the event loop, and promise vs setTimeout ordering decide most shortlists.
• Predict-the-output snippets are where most rejections happen - practice reading tricky code aloud.
• Coding tasks repeat: reverse/palindrome, remove duplicates with Set, flatten nested arrays, character frequency.
• JavaScript depth is the prerequisite for React/framework rounds - framework skill cannot patch JS gaps.

Final Takeaways

In summary, JavaScript interview questions and answers in 2026 reward candidates who can explain closures with a live example, walk through the event loop confidently, and predict tricky output without guessing. Master the 40 answers above and the four coding tasks, then layer framework prep on top.

For mentor-led preparation in Chennai, explore the Full Stack Developer Course in Chennai, read more guides on the Asmorix blog, and book a free counseling call to schedule your first mock interview.