JAVASCRIPT INTERVIEW QUESTIONS

What are the differences between var, let, and const?

In JavaScript, var, let, and const are used to declare variables, but they
differ in scope, hoisting, and reassignability.

 var is function-scoped, meaning it is accessible throughout the

function in which it is declared. It allows redeclaration and
reinitialization, which can lead to bugs.

 let is block-scoped, meaning it is only accessible within the block {}

where it is declared. It does not allow redeclaration in the same
scope.

 const is also block-scoped but does not allow reassignment.

However, objects and arrays declared with const can still be
modified internally.

In modern JavaScript, let and const are preferred because they provide
better scope control and avoid unexpected behavior.

2. What is hoisting in JavaScript?

Hoisting is JavaScript’s default behavior of moving variable and

function declarations to the top of their scope before code execution.

 Variables declared with var are hoisted and initialized with

undefined.

 Variables declared with let and const are hoisted but remain in a
Temporal Dead Zone, meaning they cannot be accessed before
initialization.

 Function declarations are fully hoisted, while function expressions

are not.

Hoisting helps explain why some variables can be used before declaration
without causing runtime errors.

3. What is the difference between null and undefined?

 undefined means a variable has been declared but has not been
assigned any value.
  null is an intentional assignment that represents an empty or non-
existent value.

In interviews, you can say:

undefined is system-assigned, while null is developer-assigned.

4. What are the different data types in JavaScript?

JavaScript has two categories of data types:

Primitive Data Types

 string

 number

 boolean

 null

 undefined

 symbol

 bigint

Non-Primitive Data Types

 object

 array

 function

Primitive types store single values, while non-primitive types store

collections or complex structures.

5. Explain the difference between synchronous and asynchronous

code.

 Synchronous code executes line by line, meaning each operation

waits for the previous one to complete. This can block execution if a
task takes time.

 Asynchronous code allows long-running operations (like API calls,

timers) to run in the background without blocking the main thread.

JavaScript uses asynchronous programming to improve performance and

user experience.
6. Difference between function declarations and function
expressions

 Function declaration is hoisted and can be called before it is

defined.

 Function expression is assigned to a variable and cannot be used

before declaration.

Function declarations are commonly used for reusable logic, while function
expressions are often used in callbacks and closures.

7. What is a callback function?

A callback function is a function passed as an argument to another

function and executed later.

Callbacks are commonly used in asynchronous operations like API calls,

event handling, and timers. They help JavaScript execute code after a task
is completed.

8. What is a higher-order function?

A higher-order function is a function that either:

 Accepts another function as an argument, or

 Returns a function as its result.

Examples include map(), filter(), and reduce(). These functions make code
more modular and readable.

9. What are arrow functions and how do they differ from regular
functions?

Arrow functions provide a shorter syntax for writing functions.

Key differences:

 Arrow functions do not have their own this; they inherit it from the
surrounding scope.

 They cannot be used as constructors.

 They are not hoisted like function declarations.

Arrow functions are commonly used in callbacks and functional
programming.

10. Explain the concept of lexical scoping.

Lexical scoping means that a function can access variables from its parent
scope.

The scope is determined at the time of writing the code, not during
execution. This concept is the foundation of closures in JavaScript.

11. How do you create an object in JavaScript?

Objects can be created using object literals, constructors, or classes.

The most common method is object literal syntax.

Objects store data in key-value pairs and are used to represent real-world
entities.

12. How would you clone an object or array?

Cloning can be done using the spread operator or built-in methods.

 Spread operator creates a shallow copy.

 For deep copies, structured cloning or JSON methods can be used.

Cloning prevents unintended mutations of the original data.

13. What is the spread operator and how does it work?

The spread operator (...) expands elements of an array or properties of an

object.

It is commonly used for copying, merging, or passing values. It improves

readability and reduces the need for manual loops.

14. What is destructuring in JavaScript?

Destructuring allows extracting values from arrays or objects into

variables in a concise way.

It improves code readability and reduces repetitive property access.

15. Explain how map(), filter(), and reduce() work.

 map() transforms each element of an array.

 filter() returns elements that satisfy a condition.

 reduce() combines all elements into a single value.

These methods are commonly used in functional programming.

16. What are template literals in JavaScript?

Template literals allow string interpolation using backticks and ${} syntax.

They support multi-line strings and dynamic content, making string

handling easier and cleaner.

17. What new features were introduced in ES6?

Major ES6 features include:

 Arrow functions

 let and const

 Promises

 Classes

 Modules

 Destructuring

 Spread and rest operators

ES6 made JavaScript more modern and developer-friendly.

18. What are default parameters in functions?

Default parameters allow assigning default values to function parameters

if no argument is passed.

They help prevent undefined values and make functions more robust.

19. What are modules in JavaScript and how do you use them?

Modules allow splitting code into multiple files for better organization.
Using export and import, code can be reused across files, improving
maintainability and scalability.

20. What is the DOM (Document Object Model)?

The DOM is a programming interface that represents HTML elements as

objects.

JavaScript uses the DOM to dynamically update content, styles, and

structure of a web page.

21. How do you manipulate the DOM using JavaScript?

DOM manipulation is done using methods like:

 Selecting elements

 Changing content

 Updating styles

 Adding or removing elements

This allows dynamic interaction with web pages.

22. Difference between innerHTML, textContent, and innerText

innerHTML returns HTML + text, textContent returns all text including

hidden, and innerText returns only visible text.

23. How do you handle events in JavaScript?

Events can be handled using inline handlers or addEventListener.

addEventListener is preferred because it separates JavaScript from HTML

and allows multiple handlers.

24. What is setTimeout() and how does it work?

setTimeout() executes a function once after a specified delay.

It is commonly used for delays, notifications, and asynchronous tasks.

25. Difference between == and ===

  == performs type coercion before comparison.

 === compares both value and data type.

=== is recommended to avoid unexpected results.

26. How does JavaScript’s new keyword work?

The new keyword:

1. Creates a new object

2. Links it to the constructor’s prototype

3. Binds this to the new object

4. Returns the object automatically

27. What is the purpose of [Link]()?

[Link]() prevents adding, deleting, or modifying properties of an

object.

It is used to make objects immutable.

28. What is JSON and how do you work with it?

JSON (JavaScript Object Notation) is a lightweight data format used for

data exchange.

 [Link]() converts objects to JSON

 [Link]() converts JSON back to objects

29. Explain promises in JavaScript.

Promises represent the result of an asynchronous operation.

They have three states:

 Pending

 Fulfilled

 Rejected

Promises help avoid callback hell and improve async code readability.
30. Purpose of async and await

async and await make promise-based code look synchronous.

They improve readability and error handling using try...catch.

31. Difference between setTimeout() and setInterval()

 setTimeout() executes once after delay.

 setInterval() executes repeatedly at fixed intervals.

32. Difference between [Link]() and [Link]()

 [Link]() resolves when all promises resolve.

 [Link]() resolves when the first promise resolves or rejects.

33. What are then() and catch() blocks?

 then() handles successful promise resolution.

 catch() handles errors.

They allow chaining asynchronous operations.