Why Merge Sort Algorithm in DSA Javascript?

The Big Idea

What if you could sort a huge messy list perfectly by just breaking it into smaller pieces?

The Scenario

Imagine you have a big messy pile of playing cards and you want to sort them by number. If you try to sort them by looking at each card one by one and moving them around randomly, it will take a long time and you might make mistakes.

The Problem

Sorting cards one by one without a plan is slow and confusing. You might lose track of which cards you already sorted, and it's easy to make errors. This manual way wastes time and energy, especially when the pile is very big.

The Solution

Merge Sort breaks the big pile into smaller piles, sorts each small pile easily, and then carefully merges them back together in order. This step-by-step plan makes sorting fast and reliable, even for very large piles.

Before vs After

✗ Before

function sortArray(arr) {
  for (let i = 0; i < arr.length; i++) {
    for (let j = i + 1; j < arr.length; j++) {
      if (arr[i] > arr[j]) {
        let temp = arr[i]; arr[i] = arr[j]; arr[j] = temp;
      }
    }
  }
  return arr;
}

✓ After

function mergeSort(arr) {
  if (arr.length <= 1) return arr;
  const mid = Math.floor(arr.length / 2);
  const left = mergeSort(arr.slice(0, mid));
  const right = mergeSort(arr.slice(mid));
  return merge(left, right);
}
function merge(left, right) {
  const result = [];
  while (left.length && right.length) {
    if (left[0] <= right[0]) result.push(left.shift());
    else result.push(right.shift());
  }
  return result.concat(left, right);
}

What It Enables

Merge Sort lets you sort huge lists quickly and correctly by breaking problems into smaller, easy steps.

Real Life Example

When a music app sorts thousands of songs by title or artist instantly, it often uses Merge Sort behind the scenes to handle the big list efficiently.

Key Takeaways

Manual sorting is slow and error-prone for big lists.

Merge Sort splits the list, sorts parts, then merges them smoothly.

This method is fast, reliable, and works well for large data.

Practice

1. What is the main idea behind the Merge Sort algorithm?

easy

A. Insert elements one by one into a sorted sublist

B. Sort the array by repeatedly swapping adjacent elements

C. Pick a pivot and partition the array around it

D. Divide the array into halves, sort each half, then merge them

Solution

1. Step 1: Understand the divide and conquer approach

   Merge Sort splits the array into two halves recursively until single elements remain.

2. Step 2: Merge sorted halves

   It then merges these sorted halves back together to form a sorted array.

3. Final Answer:

   Divide the array into halves, sort each half, then merge them -> Option D

4. Quick Check:

   Merge Sort = Divide, sort halves, merge [OK]

Hint: Remember: split, sort halves, then merge [OK]

Common Mistakes:

• Confusing Merge Sort with Bubble Sort
• Thinking Merge Sort uses a pivot like Quick Sort
• Believing Merge Sort sorts in place without extra space

2. Which of the following is the correct way to split an array arr into two halves in JavaScript for Merge Sort?

easy

A. const mid = Math.floor(arr.length / 2); const left = arr.slice(0, mid); const right = arr.slice(mid);

B. const mid = arr.length / 2; const left = arr.splice(0, mid); const right = arr.splice(mid);

C. const mid = arr.length / 2; const left = arr.slice(mid); const right = arr.slice(0, mid);

D. const mid = Math.ceil(arr.length / 2); const left = arr.slice(mid); const right = arr.slice(0, mid);

Solution

1. Step 1: Calculate middle index correctly

   Use Math.floor to get the middle index for even or odd lengths.

2. Step 2: Use slice to split without modifying original array

   Slice(0, mid) gets left half; slice(mid) gets right half correctly.

3. Final Answer:

   const mid = Math.floor(arr.length / 2); const left = arr.slice(0, mid); const right = arr.slice(mid); -> Option A

4. Quick Check:

   Use Math.floor and slice for splitting [OK]

Hint: Use Math.floor and slice to split arrays safely [OK]

Common Mistakes:

• Using splice which modifies the original array
• Not flooring the middle index causing float errors
• Swapping left and right halves incorrectly

3. What will be the output of the following JavaScript code using Merge Sort?

function mergeSort(arr) {
  if (arr.length <= 1) return arr;
  const mid = Math.floor(arr.length / 2);
  const left = mergeSort(arr.slice(0, mid));
  const right = mergeSort(arr.slice(mid));
  return merge(left, right);
}

function merge(left, right) {
  let result = [];
  while (left.length && right.length) {
    if (left[0] < right[0]) result.push(left.shift());
    else result.push(right.shift());
  }
  return result.concat(left, right);
}

console.log(mergeSort([4, 1, 3, 2]));

medium

A. [1, 3, 2, 4]

B. [4, 3, 2, 1]

C. [1, 2, 3, 4]

D. [2, 1, 3, 4]

Solution

1. Step 1: Recursively split and sort the array

   The array [4,1,3,2] is split into [4,1] and [3,2], then further until single elements.

2. Step 2: Merge sorted halves step-by-step

   Merge [4] and [1] to [1,4], merge [3] and [2] to [2,3], then merge [1,4] and [2,3] to [1,2,3,4].

3. Final Answer:

   [1, 2, 3, 4] -> Option C

4. Quick Check:

   Sorted array = [1, 2, 3, 4] [OK]

Hint: Trace splits and merges carefully to find sorted output [OK]

Common Mistakes:

• Confusing merge order causing wrong output
• Not handling empty arrays in merge
• Using shift inefficiently causing performance issues

4. Identify the bug in this Merge Sort implementation:

function mergeSort(arr) {
  if (arr.length === 1) return arr;
  const mid = Math.floor(arr.length / 2);
  const left = mergeSort(arr.slice(0, mid));
  const right = mergeSort(arr.slice(mid));
  return merge(left, right);
}

function merge(left, right) {
  let result = [];
  while (left.length && right.length) {
    if (left[0] < right[0]) result.push(left.shift());
    else result.push(right.shift());
  }
  return result.concat(left, right);
}

medium

A. Base case should be arr.length <= 1, not arr.length === 1

B. Using shift() inside merge causes infinite loop

C. Math.floor should be Math.ceil for mid calculation

D. merge function should return result.reverse()

Solution

1. Step 1: Check base case condition

   Base case returns when array length is 1, but it should also handle empty arrays (length 0) to avoid errors.

2. Step 2: Correct base case to include empty arrays

   Change condition to arr.length <= 1 to safely return arrays of length 0 or 1.

3. Final Answer:

   Base case should be arr.length <= 1, not arr.length === 1 -> Option A

4. Quick Check:

   Base case = arr.length <= 1 [OK]

Hint: Base case must handle empty arrays too [OK]

Common Mistakes:

• Ignoring empty array base case causing stack overflow
• Incorrect mid calculation causing wrong splits
• Misunderstanding shift() usage as a bug

5. You want to sort a large array of objects by a numeric property score using Merge Sort. Which modification is needed in the merge function to correctly sort by score?

hard

A. Use JSON.stringify to compare objects

B. Compare left[0].score and right[0].score instead of elements directly

C. Convert objects to strings before comparing

D. Sort only keys, then map back to objects

Solution

1. Step 1: Understand sorting objects by property

   Objects cannot be compared directly; comparison must use the numeric property score.

2. Step 2: Modify merge comparison to use score

   Change condition to compare left[0].score and right[0].score to merge correctly.

3. Final Answer:

   Compare left[0].score and right[0].score instead of elements directly -> Option B

4. Quick Check:

   Compare object properties for sorting [OK]

Hint: Compare object properties, not whole objects [OK]

Common Mistakes:

• Trying to compare objects directly causing NaN or errors
• Using string conversion which breaks numeric order
• Sorting keys separately losing object structure