Queue Concept and FIFO Principle in DSA Typescript - Build from Scratch

Queue Concept and FIFO Principle

📖 Scenario: Imagine a line of people waiting to buy tickets at a movie theater. The first person who arrives is the first person to get the ticket and leave the line. This is called FIFO - First In, First Out.We will create a queue to represent this line and see how people join and leave the queue.

🎯 Goal: Build a simple queue using an array in TypeScript that follows the FIFO principle. You will add people to the queue and remove them in the order they arrived.

📋 What You'll Learn

Create an array called queue with initial people names

Create a variable called newPerson to add to the queue

Add newPerson to the end of the queue

Remove the first person from the queue

Print the final state of the queue

💡 Why This Matters

🌍 Real World

Queues are used in real life for lines at stores, printers, and call centers where the first person to arrive is served first.

💼 Career

Understanding queues is important for software jobs that deal with task scheduling, resource management, and handling requests in order.

1

Create the initial queue

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

DSA Typescript

# Create an array called queue with 'Alice', 'Bob', 'Charlie'
// Your code here

Hint

Use square brackets to create an array and include the names as strings separated by commas.

2

Add a new person to the queue

Create a variable called newPerson and set it to 'David'

DSA Typescript

const queue: string[] = ['Alice', 'Bob', 'Charlie'];
// Create a variable newPerson and set it to 'David'
// Your code here

Hint

Use const newPerson: string = 'David'; to create the variable.

3

Add newPerson to the end of the queue

Use queue.push(newPerson) to add newPerson to the end of the queue

DSA Typescript

const queue: string[] = ['Alice', 'Bob', 'Charlie'];
const newPerson: string = 'David';
// Add newPerson to the end of queue
// Your code here

Hint

Use the push method to add an item to the end of an array.

4

Remove the first person from the queue and print the queue

Use queue.shift() to remove the first person from the queue and then use console.log(queue) to print the final state of the queue

DSA Typescript

const queue: string[] = ['Alice', 'Bob', 'Charlie'];
const newPerson: string = 'David';
queue.push(newPerson);
// Remove the first person from queue
// Print the queue
// Your code here

Hint

The shift() method removes the first item from an array. Use console.log(queue) to see the queue after removal.

Practice

1. What does the FIFO principle mean in the context of a queue?

easy

A. First In, First Out - the first element added is the first removed

B. First In, First Out - the last element added is the first removed

C. Last In, First Out - the first element added is the last removed

D. Last In, First Out - the last element added is the last removed

Solution

1. Step 1: Understand FIFO meaning

   FIFO means the first element that enters the queue is the first to leave.

2. Step 2: Match FIFO to queue behavior

   Queues follow FIFO, so the first added element is removed first.

3. Final Answer:

   First In, First Out - the first element added is the first removed -> Option A

4. Quick Check:

   FIFO = First In, First Out [OK]

Hint: Remember queue = line; first come, first served [OK]

Common Mistakes:

• Confusing FIFO with LIFO
• Thinking last added is removed first
• Mixing queue with stack behavior

2. Which of the following is the correct TypeScript syntax to create an empty queue using an array?

easy

A. let queue = {};

B. const queue: number[] = [];

C. const queue = new Queue();

D. queue = [];

Solution

1. Step 1: Identify TypeScript array syntax

   To create an empty array of numbers, use const queue: number[] = [];

2. Step 2: Check other options

   const queue = new Queue(); uses a class not defined here, A creates an object, D is missing declaration keyword.

3. Final Answer:

   const queue: number[] = []; -> Option B

4. Quick Check:

   Array declaration with type and empty brackets [OK]

Hint: Use const with type and empty brackets for empty array [OK]

Common Mistakes:

• Using object {} instead of array []
• Missing type annotation in TypeScript
• Omitting declaration keyword (const/let)

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

const queue: number[] = [];
queue.push(10);
queue.push(20);
queue.push(30);
const first = queue.shift();
console.log(queue);

medium

A. []

B. [10, 20, 30]

C. [30]

D. [20, 30]

Solution

1. Step 1: Add elements to queue

   Elements 10, 20, 30 are added to the queue in order.

2. Step 2: Remove first element using shift()

   shift() removes 10, so queue now contains [20, 30].

3. Final Answer:

   [20, 30] -> Option D

4. Quick Check:

   After shift(), queue = [20, 30] [OK]

Hint: shift() removes first element, push() adds last [OK]

Common Mistakes:

• Confusing shift() with pop()
• Expecting original array unchanged
• Thinking push() removes elements

4. Identify the error in this TypeScript queue code:

const queue: number[] = [];
queue.push(5);
queue.push(10);
const removed = queue.pop();
console.log(queue);

medium

A. Using pop() removes last, not first element in queue

B. push() is not valid for arrays

C. queue should be declared as object, not array

D. Missing type annotation for queue

Solution

1. Step 1: Understand queue removal method

   Queue removes elements in FIFO order, so first element should be removed.

2. Step 2: Check method used

   pop() removes last element, which breaks FIFO principle.

3. Final Answer:

   Using pop() removes last, not first element in queue -> Option A

4. Quick Check:

   Queue removal must use shift(), not pop() [OK]

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

Common Mistakes:

• Using pop() instead of shift() for queue
• Thinking push() removes elements
• Confusing array with object declaration

5. You have a queue implemented as an array in TypeScript. You add elements 1, 2, 3, then remove two elements. What will be the state of the queue after these operations?

const queue: number[] = [];
queue.push(1);
queue.push(2);
queue.push(3);
queue.shift();
queue.shift();
console.log(queue);

hard

A. [2, 3]

B. [1, 2, 3]

C. [3]

D. []

Solution

1. Step 1: Add elements to queue

   Elements 1, 2, 3 are added in order: queue = [1, 2, 3]

2. Step 2: Remove two elements using shift()

   First shift() removes 1, second shift() removes 2, leaving [3]

3. Final Answer:

   [3] -> Option C

4. Quick Check:

   After two shifts, queue = [3] [OK]

Hint: Each shift() removes one from front [OK]

Common Mistakes:

• Removing elements with pop() instead of shift()
• Expecting queue to be empty after two removals
• Confusing order of elements after removals