JavaScript OOP Interview Questions Master Object-Oriented Programming, Functional Programming, DOM, and Event Handling part 3

JavaScript OOP Interview Questions 2025: Master Object-Oriented Programming, Functional Programming, DOM, and Event Handling. A complete set of interview questions for frontend developers and JavaScript engineers. JavaScript OOP Interview Questions

🧱 JavaScript OOP interview questions

26. What is Object-Oriented Programming in JavaScript? JavaScript OOP Interview Questions

Answer:
JavaScript OOP Interview Questions: Object-Oriented Programming (OOP) in JavaScript is a paradigm based on the concept of “objects”, which can hold data and behavior. JavaScript supports OOP through:

• Object literals
• Constructor functions
• ES6 classes
• Prototypes

27. How do you create a class in JavaScript?

class Person {
  constructor(name) {
    this.name = name;
  }

  greet() {
    return `Hello, ${this.name}`;
  }
}

const john = new Person('John');
console.log(john.greet());

28. What is the difference between class and prototype inheritance?

Answer:

• Class inheritance is syntactic sugar introduced in ES6.
• Prototypal inheritance is the traditional way where objects inherit from other objects using the __proto__ or Object.create.

29. What are getters and setters in JavaScript?

class Circle {
  constructor(radius) {
    this._radius = radius;
  }

  get area() {
    return Math.PI * this._radius ** 2;
  }

  set radius(value) {
    this._radius = value;
  }
}

30. Explain encapsulation in JavaScript.

Answer:
Encapsulation refers to bundling data and methods together and restricting access using closures or private fields (#fieldName syntax).

class Counter {
  #count = 0;

  increment() {
    this.#count++;
    return this.#count;
  }
}

🔁 Functional Programming Interview Questions

31. What is functional programming in JavaScript?

Answer:
Functional programming (FP) is a paradigm that treats computation as the evaluation of mathematical functions without changing state or mutating data.

32. List some functional programming concepts in JavaScript.

• Pure functions
• First-class functions
• Higher-order functions
• Immutability
• Function composition

33. What is a pure function?

Answer:
A pure function returns the same output for the same input and has no side effects.

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

34. What is immutability in JavaScript?

Answer:
Immutability means that the data cannot be changed once created. Methods like map, filter, and reduce return new arrays without mutating the original.

35. What is function composition?

Answer:
Function composition is the process of combining two or more functions to produce a new function.

const compose = (f, g) => (x) => f(g(x));

🧾 DOM Manipulation & Event Handling

36. What is the DOM?

Answer:
The Document Object Model (DOM) is a programming interface for HTML and XML documents. It represents the page as a tree of objects.

37. How do you select elements in the DOM?

document.getElementById("id");
document.querySelector(".class");
document.querySelectorAll("div");

38. How do you change the content of an element?

document.getElementById("demo").textContent = "Hello World!";

39. What are events in JavaScript?

Answer:
Events are actions that occur in the browser (e.g., clicks, key presses). JavaScript allows responding to these via event listeners.

40. How do you add and remove event listeners?

const btn = document.getElementById("myBtn");
btn.addEventListener("click", () => alert("Clicked!"));

btn.removeEventListener("click", handler);

41. What is event bubbling and capturing?

Answer:

• Bubbling: Event flows from the target element up to the root.
• Capturing: Event flows from root down to the target element.

element.addEventListener('click', handler, true); // capture phase
element.addEventListener('click', handler, false); // bubble phase

42. What is event delegation?

Answer:
Event delegation uses a parent element to handle events for all child elements, useful for dynamic content.

document.getElementById("list").addEventListener("click", function(e) {
  if (e.target.tagName === "LI") {
    console.log("List item clicked");
  }
});

❌ Error Handling in JavaScript

43. How do you handle errors in JavaScript?

try {
  throw new Error("Something went wrong!");
} catch (err) {
  console.error(err.message);
} finally {
  console.log("Cleanup done.");
}

44. What is the difference between throw and try...catch?

Answer:

• throw is used to create a custom error.
• try...catch handles runtime errors gracefully.

45. What is the purpose of finally block?

Answer:
The finally block runs regardless of the outcome in try and catch. Used for cleanup operations. Functional Programming Interview Questions

Javascript functions interview questions, Closures & ES6 Part 2

📌 Up Next: Part 4

In the next part, we’ll cover:

• Built-in JavaScript methods (Array, String, Object)
• JavaScript Map, Set, WeakMap, WeakSet
• JSON & Local Storage
• JavaScript modules
• JavaScript best practices
• Real-world coding questions

Part 4 with JavaScript built-in methods, storage, modules, and more!