Array Reversal Techniques in DSA Typescript

Mental Model

Reversing an array means flipping its order so the last element becomes first and the first becomes last.

Analogy: Imagine a line of people facing forward. Reversing the array is like asking them all to turn around and face the opposite direction, so the person at the end is now at the front.

Index: 0   1   2   3   4
Array: [1] -> [2] -> [3] -> [4] -> [5]

Dry Run Walkthrough

Input: array: [1, 2, 3, 4, 5]

Goal: Reverse the array so it becomes [5, 4, 3, 2, 1]

Step 1: Swap first element (1) with last element (5)

Index: 0   1   2   3   4
Array: [5] -> [2] -> [3] -> [4] -> [1]

Why: Swapping the ends starts the reversal process

Step 2: Swap second element (2) with second last element (4)

Index: 0   1   2   3   4
Array: [5] -> [4] -> [3] -> [2] -> [1]

Why: Swapping inner elements moves the reversal inward

Step 3: Middle element (3) stays the same because it's in the center

Index: 0   1   2   3   4
Array: [5] -> [4] -> [3] -> [2] -> [1]

Why: Center element does not need to move in odd-length arrays

Result:

Index: 0   1   2   3   4
Array: [5] -> [4] -> [3] -> [2] -> [1]

Annotated Code

DSA Typescript

class ArrayReversal {
  static reverse(arr: number[]): number[] {
    let left = 0;
    let right = arr.length - 1;
    while (left < right) {
      // Swap elements at left and right
      const temp = arr[left];
      arr[left] = arr[right];
      arr[right] = temp;
      // Move pointers inward
      left++;
      right--;
    }
    return arr;
  }
}

// Driver code
const inputArray = [1, 2, 3, 4, 5];
const reversedArray = ArrayReversal.reverse(inputArray);
console.log(reversedArray.join(' -> '));

while (left < right) {

Continue swapping until pointers meet or cross

const temp = arr[left]; arr[left] = arr[right]; arr[right] = temp;

Swap elements at left and right positions

left++; right--;

Move pointers inward to next pair

Output

5 -> 4 -> 3 -> 2 -> 1

Complexity Analysis

Time: O(n) because each element is visited once during swapping

Space: O(1) because reversal is done in place without extra storage

vs Alternative: Naive approach creates a new array and copies elements in reverse order, using O(n) extra space; this method is more space efficient

Edge Cases

Empty array []

Returns empty array immediately without swaps

DSA Typescript

while (left < right) {

Single element array [7]

No swaps occur, array remains the same

DSA Typescript

while (left < right) {

Array with duplicates [2, 2, 3, 2]

Duplicates are swapped normally, reversal still correct

DSA Typescript

const temp = arr[left];

When to Use This Pattern

When you need to reverse the order of elements in a list or array efficiently, use the two-pointer swapping technique to reverse in place.

Common Mistakes

Mistake: Swapping elements without moving pointers inward, causing infinite loop
Fix: Increment left and decrement right pointers after each swap

Mistake: Using extra array unnecessarily, increasing space usage
Fix: Swap elements in place using two pointers to save space

Summary

Reverses an array by swapping elements from ends moving inward.

Use when you want to reverse an array efficiently without extra space.

The key insight is swapping pairs from the outside towards the center until pointers meet.

Practice

1. What does the reverse() method do to an array in TypeScript?

easy

A. It reverses the order of elements in the original array.

B. It sorts the array in ascending order.

C. It removes duplicate elements from the array.

D. It creates a new array with elements doubled.

Solution

1. Step 1: Understand the reverse() method

   The reverse() method changes the order of elements in the array so the last element becomes first and the first becomes last.

2. Step 2: Confirm the effect on the original array

   This method modifies the original array itself, not creating a new one.

3. Final Answer:

   It reverses the order of elements in the original array. -> Option A

4. Quick Check:

   reverse() reverses array order [OK]

Hint: Remember: reverse() flips the array in place [OK]

Common Mistakes:

• Thinking reverse() sorts the array
• Assuming reverse() creates a new array
• Confusing reverse() with removing duplicates

2. Which of the following is the correct syntax to reverse an array named arr in TypeScript?

easy

A. arr->reverse();

B. reverse(arr);

C. arr = reverse();

D. arr.reverse();

Solution

1. Step 1: Identify the method call on the array

   In TypeScript, reverse() is a method called directly on the array object using dot notation.

2. Step 2: Verify syntax

   arr.reverse(); is correct. reverse(arr); incorrectly treats reverse as a standalone function. arr = reverse(); misuses the method. arr->reverse(); uses invalid syntax.

3. Final Answer:

   arr.reverse(); -> Option D

4. Quick Check:

   Use dot notation: arr.reverse() [OK]

Hint: Use dot notation: array.reverse() [OK]

Common Mistakes:

• Calling reverse() as a standalone function
• Assigning reverse() without calling on array
• Using incorrect symbols like '->'

3. What is the output of the following TypeScript code?

const arr = [1, 2, 3, 4];
arr.reverse();
console.log(arr);

medium

A. [4, 3, 2, 1]

B. [1, 2, 3, 4]

C. [1, 4, 3, 2]

D. Error: reverse is not a function

Solution

1. Step 1: Understand the initial array

   The array starts as [1, 2, 3, 4].

2. Step 2: Apply the reverse() method

   Calling arr.reverse() reverses the array in place, changing it to [4, 3, 2, 1].

3. Final Answer:

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

4. Quick Check:

   reverse() flips array order [OK]

Hint: reverse() changes array order from end to start [OK]

Common Mistakes:

• Expecting original order after reverse()
• Confusing reverse() with sorting
• Thinking reverse() returns a new array

4. Identify the error in this TypeScript code that tries to reverse an array:

const numbers = [5, 6, 7];
const reversed = numbers.reverse;
console.log(reversed);

medium

A. reverse is not a valid method on arrays.

B. Missing parentheses to call reverse method.

C. reverse method should be called with an argument.

D. Array cannot be reversed using reverse method.

Solution

1. Step 1: Check how reverse is used

   The code assigns numbers.reverse without parentheses, so it assigns the function itself, not the reversed array.

2. Step 2: Correct usage of reverse()

   To reverse the array, the method must be called with parentheses: numbers.reverse().

3. Final Answer:

   Missing parentheses to call reverse method. -> Option B

4. Quick Check:

   Call reverse() with () to execute [OK]

Hint: Always use () to call methods like reverse() [OK]

Common Mistakes:

• Forgetting parentheses when calling methods
• Thinking reverse needs arguments
• Believing reverse is not a valid method

5. Given the array const data = [10, 20, 30, 40, 50];, which code snippet correctly reverses the array without modifying the original array?

hard

A. const reversed = data.reverse();

B. const reversed = data.sort().reverse();

C. const reversed = [...data].reverse();

D. const reversed = data.map().reverse();

Solution

1. Step 1: Understand the problem requirement

   We want to reverse the array but keep the original array unchanged.

2. Step 2: Analyze each option

   const reversed = data.reverse(); reverses the original array directly, modifying it.
   const reversed = [...data].reverse(); creates a shallow copy using spread [...data] and then reverses the copy, preserving the original.
   const reversed = data.sort().reverse(); sorts the original array first, changing order before reversing, and modifies original.
   const reversed = data.map().reverse(); uses map() incorrectly without a callback, causing error.

3. Final Answer:

   const reversed = [...data].reverse(); -> Option C

4. Quick Check:

   Copy then reverse to keep original safe [OK]

Hint: Copy array first with [...array] before reverse() [OK]

Common Mistakes:

• Using reverse() directly modifies original array
• Sorting before reversing changes order incorrectly
• Using map() without a callback causes error