Array Deletion at End in DSA Javascript

Mental Model

Removing the last item from a list means making the list one item shorter by cutting off the end.

Analogy: Imagine a stack of books on a table. Taking the top book off is like deleting the last item in an array.

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

Dry Run Walkthrough

Input: array: [1, 2, 3, 4], delete last element

Goal: Remove the last element so the array becomes [1, 2, 3]

Step 1: Check if array is empty

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

Why: We must ensure there is something to delete

Step 2: Remove last element by reducing array length by 1

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

Why: Cutting off the last element shortens the array

Result:

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

Annotated Code

DSA Javascript

class ArrayDeletion {
  constructor(arr) {
    this.arr = arr;
  }

  deleteAtEnd() {
    if (this.arr.length === 0) {
      return null; // nothing to delete
    }
    const removed = this.arr.pop(); // remove last element
    return removed;
  }

  printArray() {
    if (this.arr.length === 0) {
      console.log('Array is empty');
      return;
    }
    let result = '';
    for (let i = 0; i < this.arr.length; i++) {
      result += this.arr[i];
      if (i !== this.arr.length - 1) {
        result += ' -> ';
      }
    }
    result += ' -> null';
    console.log(result);
  }
}

// Driver code
const arrDel = new ArrayDeletion([1, 2, 3, 4]);
console.log('Before deletion:');
arrDel.printArray();
const removed = arrDel.deleteAtEnd();
console.log('Removed element:', removed);
console.log('After deletion:');
arrDel.printArray();

if (this.arr.length === 0) {

Check if array is empty to avoid errors

const removed = this.arr.pop();

Remove last element from array

for (let i = 0; i < this.arr.length; i++) {

Traverse array to print elements

Output

Before deletion:

1 -> 2 -> 3 -> 4 -> null

Removed element: 4

After deletion:

1 -> 2 -> 3 -> null

Complexity Analysis

Time: O(1) because removing the last element from an array is a direct operation

Space: O(1) because no extra space is needed for deletion

vs Alternative: Compared to deleting from the front which requires shifting all elements (O(n)), deleting at the end is faster and simpler

Edge Cases

empty array

No deletion happens, returns null

DSA Javascript

if (this.arr.length === 0) {

array with one element

Deletes the only element, array becomes empty

DSA Javascript

const removed = this.arr.pop();

When to Use This Pattern

When you need to remove the last item quickly from a list, use array deletion at end because it is simple and fast.

Common Mistakes

Mistake: Trying to delete last element by shifting all elements
Fix: Use pop() method to remove last element directly

Mistake: Not checking if array is empty before deletion
Fix: Add a check for empty array to avoid errors

Summary

Deletes the last element from an array.

Use when you want to remove the most recently added item quickly.

The key insight is that removing from the end is a direct, constant-time operation.

Practice

1. What does the pop() method do to an array in JavaScript?

easy

A. Returns the length of the array without modifying it

B. Removes the last element from the array and returns it

C. Adds a new element to the end of the array

D. Removes the first element from the array and returns it

Solution

1. Step 1: Understand the pop() method

   The pop() method removes the last element from an array and returns that element.

2. Step 2: Compare with other array methods

   Unlike shift() which removes the first element, pop() targets the end of the array.

3. Final Answer:

   Removes the last element from the array and returns it -> Option B

4. Quick Check:

   pop() removes last element [OK]

Hint: pop() always removes the last item from the array [OK]

Common Mistakes:

• Confusing pop() with shift() which removes the first element
• Thinking pop() adds elements instead of removing
• Assuming pop() returns the array length

2. Which of the following is the correct syntax to remove the last element from an array named arr?

easy

A. pop(arr);

B. arr.removeLast();

C. arr.pop();

D. arr.deleteLast();

Solution

1. Step 1: Identify the correct method for array end deletion

   JavaScript arrays use the pop() method to remove the last element.

2. Step 2: Check method call syntax

   The correct syntax is calling pop() directly on the array object: arr.pop();

3. Final Answer:

   arr.pop(); -> Option C

4. Quick Check:

   Use arr.pop() to remove last element [OK]

Hint: Use arr.pop() to remove last element [OK]

Common Mistakes:

• Using non-existent methods like removeLast() or deleteLast()
• Calling pop() as a standalone function instead of on the array
• Using incorrect syntax like pop(arr)

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

const arr = [10, 20, 30, 40];
const removed = arr.pop();
console.log(arr);
console.log(removed);

medium

A. [10, 20, 30, 40] and 30

B. [10, 20, 30, 40] and 40

C. [10, 20, 30] and 30

D. [10, 20, 30] and 40

Solution

1. Step 1: Understand pop() effect on array

   The pop() method removes the last element (40) from arr and returns it.

2. Step 2: Check the console outputs

   After popping, arr becomes [10, 20, 30] and removed stores 40.

3. Final Answer:

   [10, 20, 30] and 40 -> Option D

4. Quick Check:

   pop() removes last element and returns it [OK]

Hint: pop() returns removed last element, array shrinks by one [OK]

Common Mistakes:

• Expecting pop() to remove first element
• Confusing returned value with new last element
• Thinking array remains unchanged after pop()

4. Identify the error in the following code that tries to remove the last element from an array:

const numbers = [1, 2, 3, 4];
numbers.pop(2);
console.log(numbers);

medium

A. pop() does not take any arguments; passing 2 is incorrect

B. pop() should be called as pop(numbers)

C. pop() removes the first element, so this code is wrong

D. pop() returns the new array, so console.log will be empty

Solution

1. Step 1: Check pop() method signature

   The pop() method does not accept any arguments; it always removes the last element.

2. Step 2: Analyze the code behavior

   Passing 2 as an argument does nothing and is incorrect usage, but JavaScript ignores it and still removes the last element.

3. Final Answer:

   pop() does not take any arguments; passing 2 is incorrect -> Option A

4. Quick Check:

   pop() takes no arguments [OK]

Hint: pop() never needs arguments to remove last element [OK]

Common Mistakes:

• Passing arguments to pop() expecting to remove specific elements
• Calling pop() as a standalone function
• Assuming pop() removes first element

5. Given the array let fruits = ['apple', 'banana', 'cherry', 'date'];, which code snippet correctly removes the last two elements and stores them in a new array removedFruits in the same order as they appeared in the original array?

hard

A. const removedFruits = fruits.splice(-2);

B. const removedFruits = fruits.pop(2);

C. const removedFruits = [fruits.pop(), fruits.pop()];

D. const removedFruits = fruits.shift(2);

Solution

1. Step 1: Understand pop() vs splice() for multiple deletions

   The pop() method removes only one element at a time. To remove multiple elements, splice() is used.

2. Step 2: Analyze each option

   const removedFruits = [fruits.pop(), fruits.pop()]; removes two elements but stores them in reverse order; const removedFruits = fruits.pop(2); is invalid as pop() takes no arguments; const removedFruits = fruits.splice(-2); correctly removes last two elements and returns them as an array in original order; const removedFruits = fruits.shift(2); uses shift() incorrectly.

3. Final Answer:

   const removedFruits = fruits.splice(-2); -> Option A

4. Quick Check:

   splice(-2) removes last two elements as array [OK]

Hint: Use splice(-2) to remove last two elements at once [OK]

Common Mistakes:

• Using pop() with arguments to remove multiple elements
• Confusing shift() with pop() for end deletion
• Expecting pop() to return an array of removed elements