DEV Community

Cover image for Implementing a Custom Array Data Structure in TypeScript
Hossam Gouda
Hossam Gouda

Posted on

Implementing a Custom Array Data Structure in TypeScript

Implementing a Custom Array Data Structure in TypeScript

Are you looking to deepen your understanding of data structures in TypeScript? Let's dive into creating a custom array implementation that goes beyond the built-in array type. This article will guide you through building an ArrayList class that mimics some of the functionality of JavaScript's native arrays.

The ArrayList Class

We'll start by defining our ArrayList class:

class ArrayList<T> {
  private items: T[];
  private size: number;

  constructor() {
    this.items = [];
    this.size = 0;
  }

  // Methods will be implemented here
}
Enter fullscreen mode Exit fullscreen mode

Our ArrayList is generic, allowing it to hold any type T. We use a private array items to store elements and keep track of the size.

Basic Operations

Let's implement some fundamental array operations:

1. Adding Elements

public add(element: T): void {
  this.items[this.size] = element;
  this.size++;
}
Enter fullscreen mode Exit fullscreen mode

2. Getting Elements

public get(index: number): T {
  if (index < 0 || index >= this.size) {
    throw new Error("Index out of bounds");
  }
  return this.items[index];
}
Enter fullscreen mode Exit fullscreen mode

3. Removing Elements

public remove(index: number): T {
  if (index < 0 || index >= this.size) {
    throw new Error("Index out of bounds");
  }
  const removedItem = this.items[index];
  for (let i = index; i < this.size - 1; i++) {
    this.items[i] = this.items[i + 1];
  }
  this.size--;
  return removedItem;
}
Enter fullscreen mode Exit fullscreen mode

Additional Functionality

Let's add some more methods to enhance our ArrayList:

4. Getting the Size

public getSize(): number {
  return this.size;
}
Enter fullscreen mode Exit fullscreen mode

5. Checking if Empty

public isEmpty(): boolean {
  return this.size === 0;
}
Enter fullscreen mode Exit fullscreen mode

6. Clearing the ArrayList

public clear(): void {
  this.items = [];
  this.size = 0;
}
Enter fullscreen mode Exit fullscreen mode

Using Our ArrayList

Here's how we can use our custom ArrayList:

const list = new ArrayList<number>();

list.add(1);
list.add(2);
list.add(3);

console.log(list.get(1)); // Output: 2
console.log(list.getSize()); // Output: 3

list.remove(1);
console.log(list.getSize()); // Output: 2
console.log(list.get(1)); // Output: 3

list.clear();
console.log(list.isEmpty()); // Output: true
Enter fullscreen mode Exit fullscreen mode

Conclusion

By implementing this custom ArrayList, we've gained insight into how arrays work under the hood. This knowledge can be invaluable when optimizing code or working with more complex data structures.

Remember, while this implementation is educational, TypeScript's built-in arrays are highly optimized and should be preferred for most use cases. However, understanding these concepts will make you a more proficient TypeScript developer.

Happy coding!

Feature flag article image

Create a feature flag in your IDE in 5 minutes with LaunchDarkly’s MCP server ⏰

How to create, evaluate, and modify flags from within your IDE or AI client using natural language with LaunchDarkly's new MCP server. Follow along with this tutorial for step by step instructions.

Read full post

Top comments (0)

Scale globally with MongoDB Atlas. Try free.

Scale globally with MongoDB Atlas. Try free.

MongoDB Atlas is the global, multi-cloud database for modern apps trusted by developers and enterprises to build, scale, and run cutting-edge applications, with automated scaling, built-in security, and 125+ cloud regions.

Learn More

👋 Kindness is contagious

Discover fresh viewpoints in this insightful post, supported by our vibrant DEV Community. Every developer’s experience matters—add your thoughts and help us grow together.

A simple “thank you” can uplift the author and spark new discussions—leave yours below!

On DEV, knowledge-sharing connects us and drives innovation. Found this useful? A quick note of appreciation makes a real impact.

Okay