Array Deletion at End in DSA Typescript - Execution Trace

Concept Flow - Array Deletion at End

Start with array

↓

Check if array is empty?

Yes→Stop: nothing to delete

No↓

Remove last element

↓

Update array size

↓

Done

This flow shows how we remove the last element from an array if it is not empty.

Execution Sample

DSA Typescript

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

This code removes the last element from the array and prints the updated array.

Execution Table

Step	Operation	Array Before	Array After	Pointer Changes	Visual State
1	Start with array	[10, 20, 30, 40]	[10, 20, 30, 40]	head -> index 0, tail -> index 3	10 -> 20 -> 30 -> 40 -> null
2	Check if array is empty	[10, 20, 30, 40]	[10, 20, 30, 40]	tail index 3 valid	10 -> 20 -> 30 -> 40 -> null
3	Remove last element	[10, 20, 30, 40]	[10, 20, 30]	tail moves from index 3 to 2	10 -> 20 -> 30 -> null
4	Update array size	[10, 20, 30]	[10, 20, 30]	size decreases from 4 to 3	10 -> 20 -> 30 -> null
5	Done	[10, 20, 30]	[10, 20, 30]	tail at index 2	10 -> 20 -> 30 -> null

💡 Array size is now 3, last element removed successfully

Variable Tracker

Variable	Start	After Step 3	After Step 4	Final
arr	[10, 20, 30, 40]	[10, 20, 30]	[10, 20, 30]	[10, 20, 30]
size	4	4	3	3
tail index	3	2	2	2

Key Moments - 3 Insights

Why do we check if the array is empty before deleting?

Because if the array is empty, there is no last element to remove. Step 2 in the execution_table shows this check to avoid errors.

What happens to the array size after deletion?

The size decreases by one. Step 4 in the execution_table shows the size changing from 4 to 3 after removing the last element.

How does the tail pointer change after deletion?

The tail pointer moves one position left to the new last element. Step 3 shows tail moving from index 3 to 2.

Visual Quiz - 3 Questions

Look at the execution_table, what is the array after step 3?

A [10, 20, 30, 40]

B [10, 20, 30]

C [20, 30, 40]

D []

💡 Hint

Check the 'Array After' column in row with Step 3.

At which step does the tail pointer move?

A Step 3

B Step 2

C Step 4

D Step 5

💡 Hint

Look at the 'Pointer Changes' column to see when tail index changes.

If the array was empty at start, what would happen at step 2?

A Remove last element anyway

B Throw error and crash

C Stop deletion, no change

D Add a new element

💡 Hint

Step 2 checks if array is empty to decide whether to continue.

Concept Snapshot

Array Deletion at End:
- Check if array is empty
- Remove last element using pop()
- Update size and tail pointer
- Result: array size decreases by one
- No change if array empty

Full Transcript

This concept shows how to delete the last element from an array. We start by checking if the array is empty to avoid errors. If not empty, we remove the last element, update the size and tail pointer. The array shrinks by one element. If the array is empty, no deletion happens. This is shown step-by-step in the execution table and variable tracker.

Practice

1. What does the pop() method do when called on an array in TypeScript?

easy

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

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

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

D. Returns the length of the array without changing 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 options

   Other options describe different methods: removing first element is shift(), adding element is push(), and returning length is length property.

3. Final Answer:

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

4. Quick Check:

   pop() removes last element = A [OK]

Hint: pop() always removes from the end of the array [OK]

Common Mistakes:

• Confusing pop() with shift()
• Thinking pop() adds elements
• Assuming pop() returns array length

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

easy

A. numbers.removeLast();

B. numbers.deleteEnd();

C. pop(numbers);

D. numbers.pop();

Solution

1. Step 1: Recall the correct method to remove last element

   The correct method is pop() called on the array object.

2. Step 2: Check syntax correctness

   Only numbers.pop(); is valid TypeScript syntax. Other options are not valid methods or functions.

3. Final Answer:

   numbers.pop(); -> Option D

4. Quick Check:

   Correct pop() syntax = B [OK]

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

Common Mistakes:

• Using non-existent methods like removeLast()
• Calling pop() as a standalone function
• Using incorrect method names

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

let fruits = ['apple', 'banana', 'cherry'];
let removed = fruits.pop();
console.log(fruits);
console.log(removed);

medium

A. ['apple', 'banana', 'cherry'] and 'cherry'

B. ['apple', 'banana', 'cherry'] and undefined

C. ['apple', 'banana'] and 'cherry'

D. ['apple', 'banana'] and 'banana'

Solution

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

   Calling pop() removes the last element 'cherry' from fruits and returns it.

2. Step 2: Trace the console.log outputs

   After pop, fruits is ['apple', 'banana'] and removed is 'cherry'.

3. Final Answer:

   ['apple', 'banana'] and 'cherry' -> Option C

4. Quick Check:

   pop() removes last element = D [OK]

Hint: pop() returns removed last element and shortens array [OK]

Common Mistakes:

• Expecting pop() to remove first element
• Thinking pop() returns the new array
• Confusing removed element with array length

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

let items = [10, 20, 30];
items.pop;
console.log(items);

medium

A. Missing parentheses after pop method call

B. pop method does not exist on arrays

C. pop should be called as a standalone function

D. pop removes the first element, not last

Solution

1. Step 1: Check method call syntax

   The code uses items.pop; without parentheses, so the method is not called.

2. Step 2: Understand consequences

   Without parentheses, pop is just a reference, so the array remains unchanged.

3. Final Answer:

   Missing parentheses after pop method call -> Option A

4. Quick Check:

   pop() needs () to execute = A [OK]

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

Common Mistakes:

• Forgetting parentheses on method calls
• Thinking pop is a standalone function
• Confusing pop with shift

5. Given the array let nums = [5, 10, 15, 20];, which code snippet correctly removes the last two elements and returns the modified array?

hard

A. nums.pop(2); return nums;

B. nums.pop(); nums.pop(); return nums;

C. nums.splice(-2, 1); return nums;

D. nums.removeLast(2); return nums;

Solution

1. Step 1: Understand pop() removes one element at a time

   Calling pop() twice removes last two elements one by one.

2. Step 2: Check other options

   splice(-2, 1) removes only one element. pop(2) and removeLast(2) are invalid methods.

3. Final Answer:

   nums.pop(); nums.pop(); return nums; -> Option B

4. Quick Check:

   pop() removes one element; call twice for two [OK]

Hint: Call pop() twice to remove two elements from end [OK]

Common Mistakes:

• Trying pop() with arguments
• Using splice with incorrect parameters
• Using non-existent methods like removeLast