Array Insertion at Beginning in DSA Typescript

Mental Model

To add a new item at the start of a list, we move all existing items one step to the right to make space.

Analogy: Imagine a row of chairs where a new person wants to sit at the first chair, so everyone shifts one chair to the right to make room.

[1] -> [2] -> [3] -> null

Dry Run Walkthrough

Input: array: [1, 2, 3], insert value 0 at beginning

Goal: Add the value 0 at the start of the array, shifting others right

Step 1: Start shifting elements from the end to the right

[1] -> [2] -> [3] -> null

Why: We need to move elements to make space at index 0

Step 2: Move element at index 2 (3) to index 3

[1] -> [2] -> [3] -> [3]

Why: Shift last element right to free index 2

Step 3: Move element at index 1 (2) to index 2

[1] -> [2] -> [2] -> [3]

Why: Shift middle element right to free index 1

Step 4: Move element at index 0 (1) to index 1

[1] -> [1] -> [2] -> [3]

Why: Shift first element right to free index 0

Step 5: Insert new value 0 at index 0

[0] -> [1] -> [2] -> [3]

Why: Place new value at the beginning

Result:

[0] -> [1] -> [2] -> [3]

Annotated Code

DSA Typescript

class ArrayInsertion {
  static insertAtBeginning(arr: number[], value: number): number[] {
    // Shift elements right from end to start
    for (let i = arr.length - 1; i >= 0; i--) {
      arr[i + 1] = arr[i]; // move element right
    }
    arr[0] = value; // insert new value at start
    return arr;
  }
}

// Driver code
const arr = [1, 2, 3];
const newArr = ArrayInsertion.insertAtBeginning(arr, 0);
console.log(newArr.join(' -> '));

for (let i = arr.length - 1; i >= 0; i--) {

start shifting elements from the last index backward

arr[i + 1] = arr[i];

move current element one position to the right

arr[0] = value;

insert the new value at the beginning

Output

0 -> 1 -> 2 -> 3

Complexity Analysis

Time: O(n) because we shift all n elements one position to the right

Space: O(1) because we modify the array in place without extra space

vs Alternative: Using a new array to insert at beginning would also be O(n) time but use O(n) extra space

Edge Cases

empty array

inserts value at index 0 without shifting

DSA Typescript

for (let i = arr.length - 1; i >= 0; i--) {

array with one element

shifts single element right and inserts new value at start

DSA Typescript

for (let i = arr.length - 1; i >= 0; i--) {

When to Use This Pattern

When you need to add an item at the start of a list and must keep order, use array insertion by shifting elements right.

Common Mistakes

Mistake: Shifting elements left to right causing overwrite of data
Fix: Shift elements from right to left to avoid overwriting before moving

Mistake: Not increasing array size before shifting causing index errors
Fix: Ensure array can hold one extra element or use dynamic array methods

Summary

Adds a new element at the start of an array by shifting existing elements right.

Use when you want to insert at the beginning without losing existing data.

Shift elements from the end backward to avoid overwriting data during insertion.

Practice

1. What does inserting an element at the beginning of an array do to the existing elements?

easy

A. Replaces the first element with the new element

B. Deletes the last element of the array

C. Shifts all existing elements one position to the right

D. Leaves the array unchanged

Solution

1. Step 1: Understand array insertion at beginning

   When a new element is inserted at the start, all existing elements move one step to the right to make space.

2. Step 2: Effect on existing elements

   This shifting means the first element moves to second position, second to third, and so on.

3. Final Answer:

   Shifts all existing elements one position to the right -> Option C

4. Quick Check:

   Insert at start shifts elements right [OK]

Hint: New start element pushes others right [OK]

Common Mistakes:

• Thinking insertion replaces first element
• Assuming array size decreases
• Believing array stays unchanged

2. Which of the following is the correct TypeScript syntax to insert an element `5` at the beginning of array `arr`?

easy

A. arr.unshift(5);

B. arr.addFirst(5);

C. arr.insert(0, 5);

D. arr.push(5);

Solution

1. Step 1: Recall array methods for insertion

   In TypeScript (JavaScript), `unshift` adds elements at the start of an array.

2. Step 2: Check other options

   `push` adds at the end, `insert` and `addFirst` are not valid array methods.

3. Final Answer:

   arr.unshift(5); -> Option A

4. Quick Check:

   Use unshift() to add at beginning [OK]

Hint: Use unshift() to add at start [OK]

Common Mistakes:

• Using push() which adds at the end
• Using non-existent methods like insert()
• Confusing unshift() with pop()

3. What will be the output of the following TypeScript code?

let arr = [10, 20, 30];
arr.unshift(5);
console.log(arr);

medium

A. [10, 20, 30, 5]

B. [5, 10, 20, 30]

C. [5, 20, 30]

D. [10, 5, 20, 30]

Solution

1. Step 1: Understand unshift effect

   unshift(5) adds 5 at the start, shifting existing elements right.

2. Step 2: Resulting array

   Original [10, 20, 30] becomes [5, 10, 20, 30].

3. Final Answer:

   [5, 10, 20, 30] -> Option B

4. Quick Check:

   unshift adds at front [OK]

Hint: unshift adds element at front [OK]

Common Mistakes:

• Thinking unshift adds at end
• Misplacing the new element in the array
• Confusing unshift with push

4. Identify the error in the following TypeScript code that tries to insert `100` at the beginning of array `nums`.

let nums = [1, 2, 3];
nums.add(0, 100);
console.log(nums);

medium

A. `add` is not a valid method for arrays

B. `console.log` is used incorrectly

C. Array 'nums' is not declared properly

D. The element 100 cannot be added to arrays

Solution

1. Step 1: Check array method usage

   Arrays in TypeScript do not have an `add` method; insertion at beginning uses `unshift`.

2. Step 2: Validate other parts

   Declaration and console.log are correct; adding 100 is allowed.

3. Final Answer:

   `add` is not a valid method for arrays -> Option A

4. Quick Check:

   Use unshift(), not add() [OK]

Hint: Use unshift(), not add() for insertion [OK]

Common Mistakes:

• Using non-existent add() method
• Thinking console.log is wrong
• Believing arrays can't hold numbers

5. Given an empty array `let data: number[] = [];`, which sequence of operations will result in the array `[3, 2, 1]` by inserting elements only at the beginning?

hard

A. data.unshift(1); data.unshift(2); data.unshift(3);

B. data.push(1); data.push(2); data.push(3);

C. data.push(3); data.unshift(2); data.push(1);

D. data.unshift(3); data.unshift(2); data.unshift(1);

Solution

1. Step 1: Understand insertion at beginning

   Each unshift adds element at front, pushing existing elements right.

2. Step 2: Trace operations

   Starting empty: unshift(3) -> [3], unshift(2) -> [2,3], unshift(1) -> [1,2,3].

3. Final Answer:

   data.unshift(3); data.unshift(2); data.unshift(1); -> Option D

4. Quick Check:

   Insert in reverse order with unshift [OK]

Hint: Insert last element first with unshift [OK]

Common Mistakes:

• Using push() which adds at end
• Inserting elements in wrong order
• Mixing push and unshift incorrectly