Browser APIs and JavaScript Coding Interview Questions

Browser and practical questions#

1. What is the DOM?#

Answer: The Document Object Model is a tree representation of a page that lets browser code inspect and update document content, attributes, and structure.

2. What is event delegation?#

Answer: It attaches a listener to a common ancestor and uses event bubbling to handle events from matching descendants. It is efficient for dynamic lists and avoids registering a separate listener on every item.

3. Why prefer textContent over innerHTML for user input?#

Answer: textContent inserts the value as text. innerHTML interprets the string as markup and may create cross-site scripting risk if the string is untrusted.

4. What is localStorage?#

Answer: It is synchronous, origin-scoped string storage that usually persists across browser sessions. It is not suitable for secrets, and retrieved values should be treated as untrusted.

Coding question 1: Reverse a string#

function reverseString(value) {
  return Array.from(value).reverse().join("");
}
console.log(reverseString("hello")); // "olleh"

Array.from iterates by Unicode code points rather than UTF-16 code units, but complex grapheme clusters such as emoji sequences may still require a more specialized solution.

Coding question 2: Check for a palindrome#

function isPalindrome(value) {
  const normalized = value.toLowerCase().replace(/[^a-z0-9]/g, "");
  return normalized === Array.from(normalized).reverse().join("");
}
console.log(isPalindrome("Never odd or even")); // true

This version is intentionally limited to basic English letters and digits. International text requires a carefully chosen normalization and character-handling strategy.

Coding question 3: Remove duplicates#

function uniqueValues(values) {
  return [...new Set(values)];
}
console.log(uniqueValues([1, 2, 2, 3, 1])); // [1, 2, 3]

A Set preserves first-seen insertion order for these primitive values. Object uniqueness is based on object identity, not matching property contents.

Coding question 4: Count items#

function countWords(words) {
  const counts = new Map();
  for (const word of words) {
    counts.set(word, (counts.get(word) ?? 0) + 1);
  }
  return counts;
}
console.log([...countWords(["js", "java", "js"])]);

Coding question 5: Find the largest number#

function largestNumber(numbers) {
  if (numbers.length === 0) {
    throw new RangeError("At least one number is required");
  }
  return numbers.reduce((largest, value) => Math.max(largest, value), -Infinity);
}

In a real interview, clarify constraints first: can the array be empty, can values be non-numeric, and what should happen for invalid input? Explain complexity and edge cases before optimizing.

How to prepare#

For every answer, explain the concept, give a small example, and mention one practical trade-off or edge case. Practise reading code aloud, testing boundary inputs, and distinguishing language guarantees from browser or Node.js behaviour.