Peek Top Element of Stack in DSA Typescript - Build from Scratch

Peek Top Element of Stack

📖 Scenario: You are building a simple program to manage a stack of books. You want to see which book is currently on top without removing it.

🎯 Goal: Create a stack using an array, add some books, then peek at the top book without removing it.

📋 What You'll Learn

Create an array called stack with the exact books: 'Math', 'Science', 'History'

Create a variable called topIndex that stores the index of the top element in the stack

Create a variable called topBook that stores the book at the top of the stack using topIndex

Print the value of topBook

💡 Why This Matters

🌍 Real World

Stacks are used in many places like undo features in apps, browser history, and managing tasks in order.

💼 Career

Understanding stack operations like peek is important for software development roles that involve data structure manipulation and algorithm design.

1

Create the stack with books

Create an array called stack with these exact books in order: 'Math', 'Science', 'History'

DSA Typescript

// Your code here

Hint

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

2

Find the index of the top element

Create a variable called topIndex and set it to the last index of the stack array using stack.length - 1

DSA Typescript

const stack = ['Math', 'Science', 'History'];
// Your code here

Hint

The last index of an array is its length minus one.

3

Get the top book using the index

Create a variable called topBook and set it to the element at topIndex in the stack array

DSA Typescript

const stack = ['Math', 'Science', 'History'];
const topIndex = stack.length - 1;
// Your code here

Hint

Use square brackets [] with the index to access an array element.

4

Print the top book

Print the value of topBook using console.log(topBook)

DSA Typescript

const stack = ['Math', 'Science', 'History'];
const topIndex = stack.length - 1;
const topBook = stack[topIndex];
// Your code here

Hint

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

Practice

1. What does the peek operation do in a stack?

easy

A. Returns the top element without removing it

B. Removes the top element and returns it

C. Adds a new element to the top

D. Checks if the stack is empty

Solution

1. Step 1: Understand stack operations

   A stack supports push (add), pop (remove), and peek (view) operations.

2. Step 2: Define peek operation

   Peek returns the top element without removing it, unlike pop which removes it.

3. Final Answer:

   Returns the top element without removing it -> Option A

4. Quick Check:

   Peek = view top element only [OK]

Hint: Peek shows top without removing it [OK]

Common Mistakes:

• Confusing peek with pop
• Thinking peek adds elements
• Assuming peek checks emptiness

2. Which of the following is the correct TypeScript syntax to peek the top element of a stack implemented as an array named stack?

easy

A. stack[stack.length - 1]

B. stack.peek()

C. stack.pop()

D. stack.top()

Solution

1. Step 1: Recall array indexing for top element

   The top element of a stack implemented as an array is at index length - 1.

2. Step 2: Identify correct syntax

   Accessing stack[stack.length - 1] returns the top element without removing it.

3. Final Answer:

   stack[stack.length - 1] -> Option A

4. Quick Check:

   Array top = stack[length - 1] [OK]

Hint: Use stack[length - 1] to peek top [OK]

Common Mistakes:

• Using pop() which removes element
• Using non-existent peek() method on array
• Using top() which is not a standard method

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

const stack: number[] = [];
stack.push(10);
stack.push(20);
stack.push(30);
console.log(stack[stack.length - 1]);

medium

A. 10

B. 20

C. 30

D. undefined

Solution

1. Step 1: Trace stack push operations

   Elements pushed in order: 10, then 20, then 30. Stack is [10, 20, 30].

2. Step 2: Access top element using stack[stack.length - 1]

   stack.length is 3, so index 2 is top element which is 30.

3. Final Answer:

   30 -> Option C

4. Quick Check:

   Top element after pushes = 30 [OK]

Hint: Last pushed element is top [OK]

Common Mistakes:

• Confusing first pushed element as top
• Using pop() instead of peek
• Off-by-one error in index

4. Identify the error in the following TypeScript code that tries to peek the top element of a stack implemented as an array:

const stack: number[] = [5, 15, 25];
function peek() {
  return stack.pop();
}
console.log(peek());
console.log(stack);

medium

A. Missing return type in peek function

B. stack array is not initialized properly

C. peek function should return stack[0]

D. Using pop() removes the top element instead of just peeking

Solution

1. Step 1: Understand pop() behavior

   pop() removes and returns the top element, modifying the stack.

2. Step 2: Identify peek operation requirement

   Peek should return the top element without removing it, so pop() is incorrect here.

3. Final Answer:

   Using pop() removes the top element instead of just peeking -> Option D

4. Quick Check:

   pop() removes element, peek should not [OK]

Hint: Peek must not remove element; pop() does [OK]

Common Mistakes:

• Using pop() instead of accessing last element
• Returning stack[0] which is bottom element
• Ignoring side effects of pop()

5. You have a stack implemented as an array stack. You want to safely peek the top element but return null if the stack is empty to avoid errors. Which TypeScript code snippet correctly does this?

hard

A. return stack.pop() || null;

B. return stack.length ? stack[stack.length - 1] : null;

C. return stack[0] || null;

D. return stack[stack.length];

Solution

1. Step 1: Check if stack is empty

   Use stack.length to verify if stack has elements.

2. Step 2: Return top element or null

   If stack is not empty, return stack[stack.length - 1], else return null.

3. Final Answer:

   return stack.length ? stack[stack.length - 1] : null; -> Option B

4. Quick Check:

   Safe peek with empty check = return stack.length ? stack[stack.length - 1] : null; [OK]

Hint: Check length before peek to avoid errors [OK]

Common Mistakes:

• Using pop() which removes element
• Accessing stack[0] which is bottom element
• Accessing stack[stack.length] which is undefined