Beginner JavaScript Interview Questions

This guide covers foundational JavaScript concepts that are essential for junior and entry-level frontend engineering interviews.

1. Data Types

Q: What are the different data types in JavaScript?

JavaScript data types are divided into two categories: Primitive and Non-Primitive (Reference) types.

Primitive Types: (Stored directly in the stack, immutable)

1. String: Text data ("Hello")
2. Number: Integers and floating points (42, 3.14)
3. Boolean: Logical entities (true, false)
4. Undefined: A variable that has been declared but not assigned a value.
5. Null: Intentional absence of any object value.
6. Symbol: Unique identifiers (introduced in ES6).
7. BigInt: For numbers larger than the Number type can hold safely.

Non-Primitive Types: (Stored in the heap, accessed by reference)

1. Object: Key-value pairs (includes Arrays, Functions, Dates, etc.)

2. var, let, and const

Q: What is the difference between var, let, and const?

• var: Function-scoped. Can be re-declared and updated. It is hoisted and initialized with undefined.
• let: Block-scoped (contained within {}). Cannot be re-declared in the same scope, but can be updated. It is hoisted but remains in the Temporal Dead Zone (TDZ) until execution reaches it.
• const: Block-scoped. Cannot be re-declared or updated. Must be initialized at the time of declaration. Note: If a const variable holds an object or array, the properties of that object/array can still be mutated; only the reference itself is locked.

3. Equality Operators

Q: What is the difference between == and ===?

• == (Loose Equality): Compares values for equality after performing type coercion if the types differ. For example, 1 == "1" is true.
• === (Strict Equality): Compares both the value and the type. No type coercion occurs. For example, 1 === "1" is false. It is considered a best practice to always use === to prevent unexpected bugs.

4. null vs undefined

Q: Explain the difference between null and undefined.

• undefined means a variable has been declared but has not yet been assigned a value. It is the default value of uninitialized variables and function returns. Type: undefined.
• null is an assignment value that represents "no value" or an empty object reference. It must be assigned explicitly. Type: object (this is a known historical bug in JavaScript).

5. Array Methods

Q: Explain map(), filter(), and reduce().

These are higher-order array methods that do not mutate the original array.

• map(): Creates a new array populated with the results of calling a provided function on every element in the calling array.

  const nums = [1, 2, 3];
  const doubled = nums.map(n => n * 2); // [2, 4, 6]
  

• filter(): Creates a new array with all elements that pass the test implemented by the provided function.

  const nums = [1, 2, 3, 4];
  const evens = nums.filter(n => n % 2 === 0); // [2, 4]
  

• reduce(): Executes a reducer function on each element of the array, resulting in a single output value.

  const nums = [1, 2, 3];
  const sum = nums.reduce((acc, curr) => acc + curr, 0); // 6
  

6. DOM Manipulation

Q: What is the DOM and how do you select an element?

The DOM (Document Object Model) is a programming interface for HTML and XML documents. It represents the page so that programs can change the document structure, style, and content.

Common ways to select elements:

• document.getElementById('my-id'): Returns a single element.
• document.querySelector('.my-class'): Returns the first matching element.
• document.querySelectorAll('div'): Returns a NodeList of all matching elements.