Array Deletion at Beginning in DSA Typescript - Build from Scratch

Array Deletion at Beginning

📖 Scenario: You are managing a queue of customers waiting in line at a coffee shop. The queue is represented as an array where the first person in the array is the first to be served.

🎯 Goal: Learn how to remove the first customer from the queue (array) using array deletion at the beginning.

📋 What You'll Learn

Create an array called queue with the exact names: 'Alice', 'Bob', 'Charlie', 'Diana', 'Ethan'

Create a variable called servedCustomer to hold the name of the customer who is served first

Remove the first customer from the queue and assign their name to servedCustomer

Print the servedCustomer and the updated queue

💡 Why This Matters

🌍 Real World

Queues are used in many real-life situations like waiting lines, task scheduling, and message processing.

💼 Career

Understanding how to manipulate arrays and queues is important for software developers working on user interfaces, backend services, and real-time systems.

1

Create the initial queue array

Create an array called queue with these exact names in order: 'Alice', 'Bob', 'Charlie', 'Diana', 'Ethan'

DSA Typescript

// Your code here

Hint

Use square brackets [] to create an array and separate names with commas.

2

Create a variable to hold the served customer

Create a variable called servedCustomer and set it to an empty string ''

DSA Typescript

const queue = ['Alice', 'Bob', 'Charlie', 'Diana', 'Ethan'];
// Your code here

Hint

Use let to create a variable that can change later.

3

Remove the first customer from the queue

Remove the first customer from the queue using shift() and assign their name to servedCustomer

DSA Typescript

const queue = ['Alice', 'Bob', 'Charlie', 'Diana', 'Ethan'];
let servedCustomer = '';
// Your code here

Hint

The shift() method removes the first item from an array and returns it.

4

Print the served customer and updated queue

Print the servedCustomer and then print the updated queue array

DSA Typescript

const queue = ['Alice', 'Bob', 'Charlie', 'Diana', 'Ethan'];
let servedCustomer = '';
servedCustomer = queue.shift()!;
// Your code here

Hint

Use console.log() to print values to the console.

Practice

1. What does deleting the first element of an array using array.shift() do to the array?

easy

A. Removes the last element of the array

B. Removes the first element and shifts all other elements left

C. Deletes the entire array

D. Adds a new element at the beginning

Solution

1. Step 1: Understand shift() method

   The shift() method removes the first element of the array.

2. Step 2: Effect on array elements

   After removal, all other elements move one position to the left to fill the gap.

3. Final Answer:

   Removes the first element and shifts all other elements left -> Option B

4. Quick Check:

   shift() removes first element [OK]

Hint: Remember: shift() removes from start, pop() removes from end [OK]

Common Mistakes:

• Confusing shift() with pop()
• Thinking shift() deletes entire array
• Assuming shift() adds elements

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

easy

A. nums.shift()

B. nums.removeFirst()

C. nums.pop()

D. nums.delete(0)

Solution

1. Step 1: Identify the method to remove first element

   The correct method to remove the first element in TypeScript arrays is shift().

2. Step 2: Check other options

   pop() removes last element, removeFirst() and delete(0) are invalid methods.

3. Final Answer:

   nums.shift() -> Option A

4. Quick Check:

   Use shift() to remove first element [OK]

Hint: Use shift() to remove first element, pop() for last [OK]

Common Mistakes:

• Using pop() instead of shift()
• Using non-existent methods like removeFirst()
• Trying to delete with delete(0) which is invalid

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

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

medium

A. [40]

B. [10, 20, 30, 40]

C. [30, 40]

D. [20, 30, 40]

Solution

1. Step 1: Initial array and shift operation

   The array starts as [10, 20, 30, 40]. Calling shift() removes the first element 10.

2. Step 2: Resulting array after shift

   After removal, the array becomes [20, 30, 40].

3. Final Answer:

   [20, 30, 40] -> Option D

4. Quick Check:

   shift() removes first element, rest remain [OK]

Hint: shift() removes first element, so array starts from second element [OK]

Common Mistakes:

• Expecting original array unchanged
• Thinking shift() removes last element
• Confusing output with pop() effect

4. Consider this TypeScript code snippet:

let numbers = [5, 10, 15];
numbers.shift;
console.log(numbers);

What is the issue and how to fix it?

medium

A. Missing parentheses after shift; fix by using numbers.shift()

B. shift is not a valid method; use pop() instead

C. Array is empty; no fix needed

D. shift() removes last element; use unshift() instead

Solution

1. Step 1: Identify the method call mistake

   The code uses numbers.shift without parentheses, so the method is not called.

2. Step 2: Correct method call syntax

   Adding parentheses numbers.shift() calls the method and removes the first element.

3. Final Answer:

   Missing parentheses after shift; fix by using numbers.shift() -> Option A

4. Quick Check:

   Method calls need parentheses [OK]

Hint: Always add () to call methods like shift() [OK]

Common Mistakes:

• Forgetting parentheses on method calls
• Using pop() instead of shift() incorrectly
• Misunderstanding shift() removes first element

5. You have an array let fruits = ['apple', 'banana', 'cherry', 'date'];. You want to remove the first two fruits efficiently. Which code snippet correctly does this?

hard

A. fruits.shift(2);

B. fruits.pop(); fruits.pop();

C. fruits.splice(0, 2);

D. fruits.delete(0); fruits.delete(1);

Solution

1. Step 1: Understand removing multiple elements

   fruits.shift(2); fruits.shift(2); is incorrect: shift() takes no arguments (ignores 2) and removes only the first element.

2. Step 2: Using splice for efficient removal

   splice(0, 2) removes two elements starting at index 0 in one operation.

3. Step 3: Check other options

   pop() removes from end, delete() is invalid for arrays.

4. Final Answer:

   fruits.splice(0, 2); -> Option C

5. Quick Check:

   Use splice to remove multiple from start efficiently [OK]

Hint: Use splice(0, n) to remove n elements from start at once [OK]

Common Mistakes:

• Using shift(2) which only removes one element
• Using pop() which removes from end
• Using invalid delete() method