Creating a Stack in TypeScript

Welcome to this tutorial on implementing a Stack data structure using TypeScript! If you’re new to programming or just starting with TypeScript, don’t worry. This guide will walk you through the process step-by-step, making it easy to understand.

What is a Stack?

A Stack is a collection of elements that follows the Last In, First Out (LIFO) principle. This means that the last element added to the Stack will be the first one to be removed. Think of it like a stack of plates; you add new plates on top and remove them from the top as well.

Prerequisites

Before we dive into the code, make sure you have the following:

• Basic understanding of TypeScript.
• Node.js installed on your machine.
• A code editor like Visual Studio Code.

Step-by-Step Guide to Implementing a Stack

Now, let’s get started with creating a Stack class in TypeScript. Follow these steps carefully:

Step 1: Set Up Your Project

First, create a new directory for your project and navigate into it:

mkdir TypeScriptStack
cd TypeScriptStack

Next, initialize a new Node.js project:

npm init -y

Then, install TypeScript:

npm install typescript --save-dev

Finally, create a TypeScript configuration file:

npx tsc --init

Step 2: Create the Stack Class

Now, create a new file named Stack.ts in your project directory:

touch src/Stack.ts

Open Stack.ts in your code editor and start by defining the Stack class:

class Stack {
    private items: any[] = [];

    push(item: any) {
        this.items.push(item);
    }

    pop(): any | undefined {
        return this.items.pop();
    }

    peek(): any | undefined {
        return this.items[this.items.length - 1];
    }

    isEmpty(): boolean {
        return this.items.length === 0;
    }

    size(): number {
        return this.items.length;
    }
}

Step 3: Understanding the Code

Let’s break down the code we just wrote:

• private items: any[] = []; – This line initializes an empty array to hold the elements of the Stack.
• push(item: any) – This method adds a new item to the top of the Stack.
• pop() – This method removes and returns the top item from the Stack. If the Stack is empty, it returns undefined.
• peek() – This method returns the top item without removing it from the Stack.
• isEmpty() – This method checks if the Stack is empty.
• size() – This method returns the number of items in the Stack.

Step 4: Testing the Stack Class

To test our Stack implementation, create a new file named testStack.ts in the src directory:

touch src/testStack.ts

Open testStack.ts and add the following code:

import Stack from './Stack';

const stack = new Stack();

stack.push(1);
stack.push(2);
stack.push(3);

console.log(stack.pop()); // Output: 3
console.log(stack.peek()); // Output: 2
console.log(stack.size()); // Output: 2
console.log(stack.isEmpty()); // Output: false

Step 5: Compile and Run Your Code

Now that we have our Stack class and test code ready, let’s compile and run it:

npx tsc
node dist/testStack.js

You should see the output of your Stack operations in the console!

Conclusion

Congratulations! You’ve successfully implemented a Stack data structure in TypeScript. This foundational knowledge will help you understand more complex data structures and algorithms in the future. If you have any questions or need further clarification, feel free to reach out or check out the resources linked below.

For more information, check out the following links:

• Continue reading on Medium »”>TypeScript Documentation
• Understanding Data Structures