Top JavaScript Interview Questions and Answers

Best JavaScript interview questions for freshers and frontend developers (Basics, ES6, Functions, DOM, Async, Promises)

Searching for JavaScript interview questions? On this page, you’ll find the most important questions asked in frontend / JavaScript developer interviews, along with short and simple answers.

Covered topics: JS basics, ES6, functions, scope, closure, hoisting, arrays, objects, DOM, events, promises, async/await and real-time concepts. 2–3 sarlu chadivithe, interview mundu perfect quick revision page la use avuthundi.

1. JavaScript Basics

Q1) What is JavaScript?

Answer: JavaScript is a scripting language mainly used to make web pages interactive. It runs in the browser and can also run on the server using Node.js.

Q2) Difference between Java and JavaScript?

Answer: Java is an object-oriented programming language used for backend, desktop, Android, etc. JavaScript is a scripting language mainly used in browsers and frontend. Syntax konchem similar unna, technologies complete ga different.

Q3) What is the use of JavaScript in web development?

Answer: JavaScript is used for form validation, dynamic content, animations, API calls (AJAX/fetch), DOM manipulation, and building single-page applications.

Q4) What are primitive data types in JavaScript?

Answer: string, number, boolean, null, undefined, symbol, and bigint.

Q5) What is NaN?

Answer: NaN stands for "Not a Number". It represents an invalid number result, for example: 0 / 0 or parsing a non-numeric string using Number().

2. ES6: var, let, const and Modern Features

Q6) Difference between var, let, and const?

Answer:

Q7) What are arrow functions?

Answer: Arrow functions are a shorter syntax for writing functions and they do not have their own this, arguments, or prototype.

// Normal function
function add(a, b) {
  return a + b;
}

// Arrow function
const addArrow = (a, b) => a + b;

Q8) What is destructuring?

Answer: Destructuring allows us to unpack values from arrays or properties from objects into separate variables.

const user = { name: "Raj", age: 25 };
const { name, age } = user; // object destructuring

const arr = [1, 2, 3];
const [first, second] = arr; // array destructuring

Q9) What are template literals?

Answer: Template literals use backticks (`) and support multi-line strings and string interpolation using ${value}.

Q10) What is the spread operator (...)?

Answer: Spread operator allows iterables like arrays/objects to be expanded into individual elements.

3. Functions, Scope, Hoisting & Closures

Q11) What is the difference between function declaration and function expression?

Answer:

Q12) What is scope in JavaScript?

Answer: Scope defines where variables are accessible. Types: global scope, function scope, and block scope.

Q13) What is hoisting?

Answer: Hoisting is JavaScript's default behavior of moving declarations to the top of the current scope before code execution.

Q14) What is a closure?

Answer: A closure is formed when an inner function remembers variables from its outer function scope even after the outer function has returned.

function outer() {
  let counter = 0;
  return function inner() {
    counter++;
    console.log(counter);
  };
}

const inc = outer();
inc(); // 1
inc(); // 2 (remembers counter)

Q15) What is the this keyword in JavaScript?

Answer: this refers to the execution context. In an object method, it refers to that object, in the global scope it refers to window (in browser), and in arrow functions it uses lexical this from surrounding scope.

4. Arrays, Objects & Higher-Order Functions

Q16) What are higher-order functions?

Answer: Functions that take other functions as arguments or return functions are called higher-order functions. Example: map(), filter(), reduce().

Q17) Difference between map(), filter(), and forEach()?

Answer:

Q18) How do you clone an object in JavaScript?

Answer: Using Object.assign({}, obj) or spread operator: { ...obj }. For deep copy, structuredClone or libraries are used.

Q19) What is JSON?

Answer: JSON (JavaScript Object Notation) is a lightweight data-interchange format, widely used for API communication. It is text-based and language independent.

Q20) How do you convert JSON to object and object to JSON?

Answer:

const jsonStr = '{"name":"Raj","age":25}';
const obj = JSON.parse(jsonStr); // JSON to object

const backToJson = JSON.stringify(obj); // object to JSON

5. DOM, Events & Browser Concepts

Q21) What is the DOM?

Answer: DOM (Document Object Model) is a tree representation of HTML. JavaScript can use the DOM to read and modify page structure, style, and content.

Q22) How do you select DOM elements in JavaScript?

Answer: Using methods like document.getElementById(), getElementsByClassName(), querySelector(), and querySelectorAll().

Q23) What is event bubbling?

Answer: Event bubbling is a process where an event starts from the target element and bubbles up to its ancestors. Ex: click on button bubbles to its parent div, then body, then document.

Q24) How do you prevent default behavior of an event?

Answer: Use event.preventDefault(). Example: preventing form submission from refreshing the page.

Q25) What is event delegation?

Answer: Event delegation means attaching a single event listener to a parent element instead of multiple child elements, and using event bubbling to handle events for all children.

6. Asynchronous JavaScript: Callbacks, Promises & Async/Await

Q26) What is synchronous vs asynchronous code?

Answer: Synchronous code runs line by line and blocks next line until current line completes. Asynchronous code does not block; it schedules tasks (like API calls, timers) and continues executing.

Q27) What is a callback function?

Answer: A callback is a function passed as an argument to another function and executed later.

Q28) What are promises?

Answer: A promise represents the eventual completion or failure of an asynchronous operation and its resulting value. It has states: pending, fulfilled, rejected.

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve("Done"), 1000);
});

promise.then(result => console.log(result));

Q29) What is async/await?

Answer: async/await is syntactic sugar on top of promises that lets you write asynchronous code in a synchronous style using await inside async functions.

async function fetchData() {
  try {
    const res = await fetch("https://api.example.com/data");
    const data = await res.json();
    console.log(data);
  } catch (err) {
    console.error(err);
  }
}

Q30) What is the event loop?

Answer: The event loop is a mechanism in JavaScript that handles asynchronous callbacks. It continuously checks the call stack and callback queue and moves tasks from the queue to stack when stack is empty.

7. Quick Revision Points Before JavaScript Interview

Last 10 minutes quick check:
  • Difference: var, let, const
  • Scope, Hoisting, Closure
  • == vs ===
  • map, filter, reduce
  • DOM selection & event handling
  • Event bubbling vs capturing, event delegation
  • Promises & async/await
  • Basic knowledge of event loop

If you understand these well and read them carefully, you will be able to confidently answer most of the questions in a JavaScript interview.