JavaScript Interview Questions and Answers for Freshers (2026)

JavaScript is a high-level, interpreted programming language that runs in every web browser and, through Node.js, on servers too. It is what makes a web page interactive: handling clicks, validating forms, updating content without a reload and talking to servers. It is single-threaded, dynamically typed and supports object-oriented, functional and event-driven styles.

• var is function-scoped, can be redeclared and is hoisted and initialised as undefined.
• let is block-scoped, cannot be redeclared in the same scope and sits in the temporal dead zone until its line runs.
• const is block-scoped like let but must be assigned when declared and cannot be reassigned.

const does not make a value immutable: an object or array declared with const can still be changed, only the binding is fixed.

const user = { name: "Asha" };
user.name = "Riya";   // allowed, the object is mutated
user = {};            // TypeError: Assignment to constant variable

There are seven primitive types: string, number, bigint, boolean, undefined, null and symbol. Everything else (objects, arrays, functions, dates) is an object. Primitives are immutable and compared by value; objects are compared by reference.

== compares after type coercion, === compares value and type with no coercion. Prefer === because the coercion rules of == are easy to get wrong.

5 == "5"    // true  (string converted to number)
5 === "5"   // false (different types)
null == undefined   // true
null === undefined  // false

undefined means a variable has been declared but not assigned a value (or a function returned nothing). null is an intentional "no value" that a developer assigns. typeof undefined is "undefined", while typeof null is "object", a long-standing quirk of the language.

It is a bug from the first version of JavaScript that was never fixed because changing it would break existing websites. null is a primitive, not an object. To check for null, use value === null.

NaN ("Not a Number") is the result of an invalid numeric operation such as 0 / "abc". It is the only value that is not equal to itself, so NaN === NaN is false. Use Number.isNaN(x), which does not coerce, rather than the global isNaN(x), which converts the argument to a number first.

isNaN("hello")         // true  (coerces "hello" to NaN)
Number.isNaN("hello")   // false (it is a string, not NaN)
Number.isNaN(NaN)       // true

In a boolean context every value is either truthy or falsy. There are only eight falsy values: false, 0, -0, 0n, "", null, undefined and NaN. Everything else is truthy, including "0", [], {} and "false".

Hoisting is JavaScript moving declarations to the top of their scope during the compile phase. Function declarations are hoisted with their body, var is hoisted and set to undefined, and let/const are hoisted but not initialised.

console.log(a);   // undefined
var a = 5;

sayHi();          // works, the whole function is hoisted
function sayHi() { console.log("hi"); }

console.log(b);   // ReferenceError (temporal dead zone)
let b = 5;

The TDZ is the time between entering a scope and the line where a let or const variable is declared. Accessing the variable in that window throws a ReferenceError. It exists to catch use-before-define bugs that var silently allowed.

• Global scope: variables declared outside any function or block.
• Function scope: variables declared inside a function are not visible outside it.
• Block scope: let and const inside { } exist only within those braces.
• Module scope: top-level variables in an ES module are private to that file unless exported.

Inner scopes can read outer scopes. This lookup is called the scope chain.

Strict mode turns silent mistakes into errors. It prevents accidental global variables, disallows duplicate parameter names, makes this undefined in plain functions and throws when you assign to read-only properties. ES modules and classes are strict by default.

Type coercion is JavaScript converting a value from one type to another automatically. The + operator prefers strings, while -, * and / prefer numbers.

"5" + 3     // "53"  (number becomes a string)
"5" - 3     // 2     (string becomes a number)
true + 1    // 2
[] + {}     // "[object Object]"

let creates a new binding for every iteration, so closures created in the loop capture the value of that iteration. var has one binding shared by the whole function, so all closures see the final value. This is the classic setTimeout in a for loop question (see the output-based section below).

An expression produces a value (2 + 3, fn(), x ? a : b). A statement performs an action (if, for, let x = 1) and does not produce a value you can use inline. Anywhere JavaScript expects a value you must supply an expression.

A declaration (function add() {}) is fully hoisted, so you can call it before it appears in the file. A function expression (const add = function() {}) is only available after the line runs, because the variable is hoisted but not its value.

• Shorter syntax and an implicit return for single expressions.
• No this of their own: they use the this of the surrounding code (lexical this).
• No arguments object (use rest parameters instead).
• Cannot be used with new as constructors and have no prototype.

const double = n => n * 2;

const counter = {
  count: 0,
  start() {
    setInterval(() => { this.count++; }, 1000); // "this" is counter
  }
};

A closure is a function that remembers the variables of the scope where it was created, even after that outer function has finished running. Closures power private state, memoisation, callbacks and event handlers.

function makeCounter() {
  let count = 0;            // private variable
  return function () {
    count++;
    return count;
  };
}
const next = makeCounter();
next(); // 1
next(); // 2  (count survives between calls)

Interview tip: Be ready to name a real use: data hiding, function factories, or why a loop with var and setTimeout misbehaves.

An Immediately Invoked Function Expression runs as soon as it is defined: (function () { ... })();. Before let, const and modules existed, it was the way to create a private scope and avoid polluting the global namespace.

A function that takes another function as an argument, returns a function, or both. map, filter, reduce, setTimeout and addEventListener are all higher-order functions.

A function passed into another function to be called later, typically when an operation finishes or an event occurs. Callbacks are the original way to handle asynchronous work in JavaScript, and nesting many of them leads to "callback hell", which promises and async/await solve.

Currying turns a function that takes several arguments into a chain of functions that each take one argument.

const add = a => b => c => a + b + c;
add(1)(2)(3); // 6

const addTen = add(5)(5); // partially applied, reusable

All three set the value of this for a function. call(thisArg, a, b) runs the function immediately with arguments listed out. apply(thisArg, [a, b]) runs it immediately with an array of arguments. bind(thisArg) does not run it; it returns a new function with this permanently fixed.

function intro(city) { return this.name + " from " + city; }
const user = { name: "Dev" };
intro.call(user, "Rajkot");    // "Dev from Rajkot"
intro.apply(user, ["Rajkot"]); // "Dev from Rajkot"
const bound = intro.bind(user);
bound("Rajkot");               // "Dev from Rajkot"

• In a regular function call, this is undefined in strict mode (the global object otherwise).
• As a method (obj.fn()), this is the object before the dot.
• With new, this is the newly created object.
• With call, apply or bind, this is whatever you pass in.
• In an arrow function, this comes from the enclosing scope.
• In a DOM event handler (regular function), this is the element that received the event.

Interview tip: Interviewers often show a method pulled off an object (const f = obj.method; f()) to see if you know this is lost.

A pure function always returns the same output for the same input and has no side effects: it does not change external variables, the DOM or files. Pure functions are easier to test and are the basis of how reducers in React/Redux work.

Default parameters give a fallback value (function greet(name = "friend")). The rest parameter collects extra arguments into an array (function sum(...nums)). Spread does the opposite and expands an array or object into individual items (Math.max(...nums)).

Debounce waits until the user has stopped triggering an event for a set time, then runs once (search-as-you-type). Throttle runs at most once every set interval no matter how often the event fires (scroll or resize handlers).

function debounce(fn, delay) {
  let timer;
  return function (...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}

Recursion is a function calling itself until a base case stops it. It suits tree walking and divide-and-conquer problems. Each call adds a frame to the call stack, so very deep recursion throws "Maximum call stack size exceeded"; an iterative loop avoids that.

function factorial(n) {
  if (n <= 1) return 1;       // base case
  return n * factorial(n - 1);
}
factorial(5); // 120

• Object literal: { name: "Asha" }
• Constructor function with new
• Object.create(proto) to set the prototype directly
• ES6 class with new
• Factory function that returns an object

Every object has an internal link to another object called its prototype. When you read a property, JavaScript looks on the object, then its prototype, then that object's prototype, and so on until it reaches null. This chain is how inheritance works, and it is why arrays can use map (it lives on Array.prototype).

The class keyword is syntax on top of prototypal inheritance. Under the hood a class is still a constructor function and methods live on the prototype. Classes give a cleaner syntax for constructor, extends, super, static and private fields (#field).

A shallow copy duplicates only the top level; nested objects are still shared by reference. A deep copy duplicates every level. { ...obj } and Object.assign are shallow. Use structuredClone(obj) for a deep copy (the older JSON.parse(JSON.stringify(obj)) trick loses dates, functions and undefined).

const a = { x: 1, nested: { y: 2 } };
const shallow = { ...a };
shallow.nested.y = 99;
console.log(a.nested.y);   // 99  (shared)

const deep = structuredClone(a);
deep.nested.y = 5;
console.log(a.nested.y);   // 99  (unchanged)

• const stops reassignment of the variable, but the object can still change.
• Object.freeze makes an object read-only: no adding, deleting or changing properties (shallow only).
• Object.seal blocks adding and deleting properties but still lets you change existing values.

Destructuring unpacks values from arrays or properties from objects into variables in one line.

const { name, city = "Rajkot" } = user;     // object
const [first, , third] = ["a", "b", "c"];    // array, skipping one
const { address: { pin } } = user;           // nested

Both use .... Rest gathers several values into one array or object (in function parameters and destructuring). Spread expands an iterable into separate values (in calls, array literals and object literals).

const nums = [1, 2, 3];
const more = [...nums, 4];            // spread
const { a, ...others } = { a: 1, b: 2, c: 3 }; // rest -> others = { b: 2, c: 3 }

• forEach runs a function for each item and returns nothing.
• map returns a new array of the same length with each item transformed.
• filter returns a new array with only the items for which the callback returned true.
• reduce folds the array down to a single value (a sum, an object, another array).

const prices = [100, 250, 80];
prices.map(p => p * 1.18);           // [118, 295, 94.4]
prices.filter(p => p > 90);          // [100, 250]
prices.reduce((sum, p) => sum + p, 0); // 430

slice(start, end) returns a copy of part of an array and does not change the original. splice(start, deleteCount, ...items) removes and/or inserts items in place and mutates the original array. Newer, non-mutating options are toSpliced, toSorted and toReversed.

const unique = [...new Set([1, 2, 2, 3, 3])];  // [1, 2, 3]

A Set stores each value only once, and spreading it back gives an array.

• Map accepts any type as a key (objects, functions), keeps insertion order and has a .size; an object's keys are strings or symbols.
• Set stores unique values and has fast .has() lookups; an array allows duplicates and is index-based.
• WeakMap/WeakSet hold their keys weakly, so entries can be garbage collected when nothing else references the key.

for...in loops over the enumerable property names (keys) of an object, including inherited ones. for...of loops over the values of an iterable such as an array, string, Map or Set.

for (const i in ["a", "b"]) console.log(i);   // "0", "1"
for (const v of ["a", "b"]) console.log(v);   // "a", "b"

Optional chaining stops and returns undefined instead of throwing when something in the chain is null or undefined. The ?? operator returns the right side only when the left is null or undefined, unlike || which also replaces 0 and "".

user?.address?.city;      // undefined, no error
const limit = settings.limit ?? 10;   // keeps 0 if limit is 0

ES modules use import/export, are loaded statically (so tools can tree-shake unused code) and work in browsers and modern Node.js. CommonJS uses require() and module.exports, loads synchronously and was the original Node.js format.

JSON.stringify(value) turns a JavaScript value into a JSON string (for sending to a server or saving to storage). JSON.parse(text) turns a JSON string back into a value. Functions, undefined and symbols are dropped by stringify, and dates become strings.

Synchronous code runs line by line and each line waits for the previous one. Asynchronous code starts a long task (a network request, a timer) and lets the rest of the program continue; the result is handled later through a callback, promise or await.

JavaScript runs on a single thread with a call stack. Async work such as timers and network calls is handled by the browser (or Node), which puts the finished callbacks into queues. The event loop repeatedly checks: if the call stack is empty, first run all microtasks (promise callbacks, queueMicrotask), then take one task from the macrotask queue (setTimeout, DOM events), and repeat.

Interview tip: The sentence "microtasks run before the next macrotask" answers most event loop output questions.

Callback hell is deeply nested callbacks that make code hard to read and handle errors in. You avoid it with promises, async/await, and by splitting logic into small named functions.

A Promise represents a value that will be available later. It is always in one of three states: pending, fulfilled (resolved with a value) or rejected (failed with a reason). Once settled it never changes. You consume it with .then(), .catch() and .finally().

const wait = ms => new Promise(resolve => setTimeout(resolve, ms));
wait(500).then(() => console.log("done"));

• Promise.all: waits for all to succeed; rejects as soon as one rejects.
• Promise.allSettled: waits for all to finish and returns each result as fulfilled or rejected.
• Promise.race: settles as soon as the first promise settles, success or failure.
• Promise.any: fulfils with the first success; rejects only if all reject.

async/await is syntax that lets you write promise-based code in a synchronous-looking way. An async function always returns a promise, and await pauses that function (not the whole program) until the promise settles.

async function loadUser(id) {
  const res = await fetch("/api/users/" + id);
  return res.json();
}

Wrap await calls in try/catch, or add .catch() to a promise chain. An unhandled rejection can crash a Node process or show up as a console warning in the browser.

try {
  const data = await loadUser(7);
} catch (err) {
  console.error("Could not load user", err);
} finally {
  hideSpinner();
}

No. fetch only rejects on network failure. A 404 or 500 still resolves, so you must check response.ok (or response.status) yourself and throw if needed. This is one of the most common beginner bugs.

const res = await fetch(url);
if (!res.ok) throw new Error("HTTP " + res.status);
const data = await res.json();

setTimeout(fn, ms) runs a function once after a delay. setInterval(fn, ms) runs it repeatedly until you call clearInterval. The delay is a minimum, not a guarantee, because the callback must wait for the call stack to be free.

A generator (function*) can pause with yield and resume later, producing values one at a time. They are useful for lazy sequences, custom iterators and, historically, the basis on which async/await was built.

The Document Object Model is the browser's tree representation of an HTML page. JavaScript uses it to read, change, add or remove elements and to react to events. It is not part of the JavaScript language itself; it is an API provided by the browser.

getElementById finds one element by its id and is the fastest. querySelector accepts any CSS selector and returns the first match. querySelectorAll returns a static NodeList of all matches.

When an event happens on an element it travels in two phases: capturing (from the window down to the target) and then bubbling (from the target back up through its parents). Listeners run in the bubbling phase by default. event.stopPropagation() stops the event from travelling further.

Instead of adding a listener to every child, you add one listener to a common parent and check event.target. It uses less memory and also works for elements added later.

document.querySelector("#list").addEventListener("click", (e) => {
  if (e.target.matches("li")) {
    console.log("clicked", e.target.textContent);
  }
});

• localStorage: about 5 MB, stays until cleared, same-origin only, never sent to the server automatically.
• sessionStorage: same API, but cleared when the tab closes.
• Cookies: about 4 KB each, can expire, and are sent with every request to that domain, so they suit sessions and authentication.

Never store passwords or sensitive tokens in localStorage; any script on the page can read it.

Both download the script without blocking HTML parsing. async runs the script as soon as it is downloaded, in any order. defer waits until the HTML is parsed and runs deferred scripts in the order they appear. Use defer for scripts that depend on the DOM or on each other.

Cross-Origin Resource Sharing is a browser security rule that blocks a page from reading responses from a different origin (protocol, domain or port) unless that server allows it with headers such as Access-Control-Allow-Origin. It is enforced by the browser, so the fix is on the server, not in your front-end code.

const reverse = (s) => [...s].reverse().join("");
reverse("codeksha"); // "ahskedoc"

function isPalindrome(str) {
  const clean = str.toLowerCase().replace(/[^a-z0-9]/g, "");
  return clean === [...clean].reverse().join("");
}
isPalindrome("A man, a plan, a canal: Panama"); // true

for (let i = 1; i <= 15; i++) {
  if (i % 15 === 0) console.log("FizzBuzz");
  else if (i % 3 === 0) console.log("Fizz");
  else if (i % 5 === 0) console.log("Buzz");
  else console.log(i);
}

[1, [2, [3, [4]]]].flat(Infinity); // [1, 2, 3, 4]

Without flat, use recursion with reduce and concat.

const text = "to be or not to be";
const count = text.split(" ").reduce((acc, w) => {
  acc[w] = (acc[w] || 0) + 1;
  return acc;
}, {});
// { to: 2, be: 2, or: 1, not: 1 }

function twoSum(nums, target) {
  const seen = new Map();            // value -> index
  for (let i = 0; i < nums.length; i++) {
    const need = target - nums[i];
    if (seen.has(need)) return [seen.get(need), i];
    seen.set(nums[i], i);
  }
  return [];
}
twoSum([2, 7, 11, 15], 9); // [0, 1]

One pass with a Map is O(n) time, compared with O(n²) for two nested loops.

const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
(async () => { await sleep(1000); console.log("1s later"); })();

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}

Output: 3 3 3. var has one shared binding and the timeouts run after the loop ends. Change var to let and the output becomes 0 1 2.

console.log("1");
setTimeout(() => console.log("2"), 0);
Promise.resolve().then(() => console.log("3"));
console.log("4");

Output: 1 4 3 2. Synchronous code first, then the promise (microtask), then the timeout (macrotask).

console.log(0.1 + 0.2 === 0.3);
console.log(0.1 + 0.2);

Output: false and 0.30000000000000004. Numbers use binary floating point, so some decimals cannot be stored exactly. Compare with a tolerance (Math.abs(a - b) < Number.EPSILON) or work in whole units such as paise.

console.log([] + []);
console.log([] + {});
console.log("5" + 3, "5" - 3);
console.log(typeof NaN);

Output: an empty string, [object Object], 53 2 and number.

console.log(1 < 2 < 3);
console.log(3 > 2 > 1);

Output: true and false. 3 > 2 is true, which becomes 1, and 1 > 1 is false.

console.log(typeof hello);
var hello = "hi";
function hello() {}

Output: function. The function declaration is hoisted above the var, and the assignment "hi" has not run yet when typeof is evaluated.

const user = {
  name: "Asha",
  regular() { return this.name; },
  arrow: () => typeof this,
};
const detached = user.regular;
console.log(user.regular(), detached());

user.regular() returns "Asha". The detached call loses its object, so this.name is undefined (or a TypeError in strict mode). The arrow function does not get its own this either.