JavaScript is asked in almost every frontend, full-stack and Node.js interview. These JavaScript interview questions start with data types, scope and functions for freshers, then cover closures, this, prototypes, promises, async/await, the event loop and performance for experienced developers.
30 questions · Updated
Fundamentals, definitions and simple scenarios. Good for freshers and warm-ups.
There are seven primitive types: string, number, bigint, boolean, undefined, null and symbol.
Everything else is an object, including arrays, functions and dates.
Primitives are immutable and compared by value, while objects are compared by reference, so two different objects with the same contents are not equal. typeof null returning "object" is a well-known historical bug.
undefined means a variable has been declared but not assigned, a missing function argument, or a property that does not exist. null is an intentional "no value" set by the developer. null == undefined is true, but null === undefined is false. The ?? operator treats both as missing values.
Hoisting means declarations are processed before code runs. Function declarations are fully hoisted, so they can be called before they appear. var declarations are hoisted and initialised to undefined. let, const and class declarations are hoisted but stay in the temporal dead zone until their line runs, so accessing them earlier throws a ReferenceError.
var is scoped to the function, is hoisted with the value undefined and can be declared twice. let and const are scoped to the nearest block, such as an if or a loop, and cannot be used before their declaration line. const must be assigned once and cannot be reassigned, although the object or array it holds can still be changed. Modern code uses const by default and let when a value must change.
== converts the two values to the same type before comparing, which gives surprising results: "0" == 0 and "" == 0 are true, and [] == false is true. === compares both type and value with no conversion, so it behaves predictably. A common, deliberate exception is x == null, which is true for both null and undefined.
Global scope is available everywhere.
Function scope belongs to variables declared inside a function.
Block scope, created by let and const inside curly braces, limits a variable to that block.
Module scope means top-level variables in an ES module are private to that file unless exported.
JavaScript uses lexical scope: a function can read variables from where it was written, not from where it is called.
Both use three dots.
Spread expands an array or object into individual items, for example copying [...arr], merging {...a, ...b} or passing an array as arguments with Math.max(...nums).
Rest does the opposite and collects several items into one array or object, for example function sum(...nums) or const { id, ...rest } = user.
The position decides which one it is.
false, 0, -0, 0n (BigInt zero), "" (empty string), null, undefined and NaN.
Everything else is truthy, including "0", "false", empty arrays [] and empty objects {}.
This matters in conditions such as if (items.length), and is why ?? is often better than || for defaults, since || also replaces valid values like 0 and "".
typeof returns a string with the basic type of a value: "string", "number", "boolean", "undefined", "object", "function", "symbol" or "bigint".
It cannot tell arrays from objects and returns "object" for null. instanceof checks whether an object has a constructor's prototype in its prototype chain, for example date instanceof Date.
To check for an array, use Array.isArray().
push, pop, shift, unshift, splice, sort, reverse and fill all change the array in place. slice, concat, map, filter, reduce, and the newer toSorted, toReversed, toSpliced and with return new arrays and leave the original untouched. In React and other state-based code, the non-mutating methods are preferred so changes can be detected.
NaN means "Not a Number" and is the result of invalid maths, such as Number("abc") or 0 / 0.
Its type is still "number".
NaN is the only value not equal to itself, so NaN === NaN is false.
Use Number.isNaN(value) to check for it; the older global isNaN converts its argument first, so isNaN("abc") is true, which is misleading.
Applied problems, trade-offs and questions about your own projects.
this depends on how a function is called.
In a method call obj.fn(), this is obj.
In a plain function call it is undefined in strict mode (or the global object otherwise).
With new it is the new object. call, apply and bind set it explicitly.
Arrow functions do not have their own this; they use this from the surrounding scope, which is why they are handy in callbacks.
Every object has an internal link to a prototype object.
When a property is not found on the object, JavaScript looks up the prototype chain until it finds it or reaches null.
Classes are syntax on top of this: methods defined in a class live on its prototype and are shared by all instances.
Object.create(proto) creates an object with a given prototype.
A promise represents a value that will be available later, in a pending, fulfilled or rejected state, with .then, .catch and .finally to handle the result. async functions always return a promise, and await pauses the function until a promise settles, so asynchronous code reads like synchronous code.
Errors are handled with try/catch.
Promise.all runs tasks in parallel and fails fast; Promise.allSettled waits for all.
map returns a new array with each element transformed. filter returns a new array with elements that pass a test. reduce combines all elements into a single value, such as a total or an object grouped by key. forEach runs a function for each element and returns undefined, used only for side effects. map, filter and reduce do not change the original array.
A closure is a function bundled with the variables of the scope it was created in.
The function keeps access to those variables even after the outer function has returned.
Closures make private state possible, and they power callbacks, memoisation, debounce functions and React hooks.
function makeCounter() {
let count = 0; // private to the closure
return () => ++count;
}
const next = makeCounter();
next(); // 1
next(); // 2Synchronous code runs first, then all microtasks (promise callbacks), then macrotasks (timers).
So this prints 1, 4, 3, 2.
Even a 0 ms timeout waits until the call stack and the microtask queue are empty.
This question tests whether you understand the event loop.
console.log(1);
setTimeout(() => console.log(2), 0);
Promise.resolve().then(() => console.log(3));
console.log(4);
// Output: 1, 4, 3, 2All three set the value of this for a function. call invokes it immediately with arguments listed one by one, fn.call(obj, a, b). apply invokes it immediately with arguments as an array, fn.apply(obj, [a, b]). bind does not call the function; it returns a new function with this (and optionally some arguments) fixed, which is useful for callbacks and event handlers.
Currying turns a function that takes several arguments into a chain of functions that each take one, so add(a, b) becomes add(a)(b).
It lets you create specialised functions by fixing some arguments, such as const addTax = multiply(1.18), and is common in functional programming and utility libraries.
It relies on closures to remember earlier arguments.
ES modules use import and export, are the official JavaScript standard, work in browsers and Node.js, load asynchronously, are statically analysable so bundlers can tree-shake unused code, and support top-level await.
CommonJS uses require and module.exports, loads synchronously and was Node.js's original system.
New code should use ES modules.
A Map is a key-value collection where keys can be any type, including objects, keeps insertion order, has a size property and is faster for frequent additions and removals.
Plain objects are better for fixed records and JSON.
A Set stores unique values, which makes removing duplicates easy with [...new Set(arr)] and membership checks with has() faster than array.includes on large data.
An iterator is an object with a next() method that returns { value, done }.
Anything with a [Symbol.iterator] method is iterable and works with for...of and spread.
A generator function, written function*, returns an iterator and uses yield to pause and produce values one at a time, which suits lazy sequences, infinite streams and custom iteration over data structures.
System design, deep internals, leadership and tough follow-ups.
Debouncing delays a function until a certain time has passed since the last call, so it runs once after the user stops, which suits search inputs and resize handlers.
Throttling makes a function run at most once per interval no matter how often it is triggered, which suits scroll and mousemove handlers.
Both are built with closures around setTimeout and reduce unnecessary work and API calls.
Common causes are forgotten timers and intervals, event listeners that are never removed, closures holding large objects, detached DOM nodes still referenced in code, and caches that grow forever.
I find them with Chrome DevTools: take heap snapshots before and after an action, compare them, and look for objects that keep growing.
Cleaning up in component unmount and using WeakMap for caches helps.
A shallow copy, made with the spread operator, Object.assign or Array.slice, copies only the top level; nested objects are still shared, so changing them affects the original.
A deep copy duplicates every level. structuredClone() is the modern built-in way to deep copy and handles dates, maps and circular references.
JSON.parse(JSON.stringify(obj)) works for plain data but loses functions, dates and undefined.
WeakMap and WeakSet hold their object keys weakly: if nothing else references the object, it can be garbage collected and its entry disappears.
They are not iterable and have no size.
They are used to attach private data or metadata to objects, such as DOM nodes, or to cache results per object without causing memory leaks.
A Proxy wraps an object and intercepts operations on it, such as reading, writing or deleting properties, through handler functions called traps.
It is used for validation, logging, default values and reactivity systems such as Vue 3's.
Reflect provides methods matching each trap, such as Reflect.get and Reflect.set, so a trap can perform the default behaviour after its own logic.
JavaScript engines free memory automatically using reachability.
Starting from roots such as global variables and the current call stack, the collector marks every object it can reach and sweeps away the rest (mark and sweep).
V8 uses generations: new objects are collected often and quickly, and survivors move to an old space collected less often.
Leaks happen when unwanted objects stay reachable.
Strict mode, turned on with "use strict" and automatically in ES modules and classes, makes JavaScript safer.
Assigning to an undeclared variable throws an error instead of creating a global, this is undefined in plain function calls instead of the global object, duplicate parameter names are not allowed, and writing to read-only properties throws.
It catches bugs early.
An engine such as V8 parses source code into an abstract syntax tree, an interpreter (Ignition) turns it into bytecode and runs it quickly, and an optimising compiler (TurboFan) compiles frequently used functions into fast machine code based on the types it has observed.
If those assumptions break, for example a function suddenly receives different types, the code is de-optimised.
Consistent object shapes and types help performance.
Tasks you build live in 30 to 60 minutes. What interviewers look for, plus a compact solution to compare with yours.
Tests this, closures and apply. The returned function must keep the bound this and any preset arguments, and accept more arguments when called.
Function.prototype.myBind = function (context, ...preset) {
const fn = this;
return function (...later) {
return fn.apply(context, [...preset, ...later]);
};
};
const greet = function (greeting) { return greeting + ', ' + this.name; };
greet.myBind({ name: 'Asha' })('Hello'); // "Hello, Asha"Checks closures and caching.
Use a Map keyed by the arguments.
Discuss limits: JSON.stringify keys only suit simple arguments, and the cache can grow without bound.
function memoize(fn) {
const cache = new Map();
return function (...args) {
const key = JSON.stringify(args);
if (!cache.has(key)) cache.set(key, fn.apply(this, args));
return cache.get(key);
};
}
const slowSquare = (n) => n * n;
const fastSquare = memoize(slowSquare);A common warm-up. Call the callback with the element, index and array, skip empty slots, and return a new array without changing the original.
Array.prototype.myMap = function (callback, thisArg) {
const result = new Array(this.length);
for (let i = 0; i < this.length; i++) {
if (i in this) result[i] = callback.call(thisArg, this[i], i, this);
}
return result;
};
[1, 2, 3].myMap((x) => x * 2); // [2, 4, 6]See all Frontend Developer interview questions, covering HTML, CSS, JavaScript, TypeScript, React and more.