Generic Classes in TypeScript
Build an AI-First Career, Master the Complete Skillset
Choose from our industry-leading programs designed for career success
Modern Software and AI Engineering Program
Master full-stack development with AI integration
+1000 moreModern Data Science and ML with specialisation in AI
Advanced data science techniques with AI specialization
+1000 moreAdvanced AIML with Specialisation in Agentic AI
Deep dive into AIML with focus on Agentic systems
+1000 moreDevOps, Cloud & AI Platform Engineering
Build and manage AI-powered cloud infrastructure
+1000 moreAI Engineering Advanced Certification by IIT-Roorkee
Premier AI engineering certification from IIT-Roorkee
AI Forward Deployed Engineer Program
Full-stack engineering, production AI and client-facing consulting
+1000 moreOverview
Generics in TypeScript is a tool that provides a way to create reusable components. It works with a variety of data types rather than a single data type. They provide type safety without compromising performance or productivity. We are required to write a type parameter between open < and close > brackets, which makes the generics strongly typed collections. They use a special kind of type variable <T> that denotes types. The collections of generics have similar types of objects. In TypeScript, Generic Classes, Generic Functions, Generic Methods, and Generic Interfaces can be created.
What are Generic Classes in TypeScript?
TypeScript supports generic classes. The generic type parameter is declared in angle brackets <> following the name of the class. We can have more than one type parameter separated by a comma. We can mark the same type parameter to mark the type of the function to let us change the parameter and return the type of methods within the class.
A generic class has generic fields or methods. It certifies that the specified data types are used consistently throughout the class. Generic classes encapsulate the operations that are not specific to a particular data type. A common use of the generic class is with collections like trees, stacks, queues, hash tables, etc.
Syntax of Declaring Generic Classes in TypeScript
The syntax for declaring a generic class is:
TypeScript allows us to have multiple generic types in the type parameter list.
The generic constraints are applied to the generic types in the class:
When we place the type parameter on the class, this allows us to develop methods and properties that work with the same type.
How Scaler Transformed Careers in Different Fields
Scaler learners achieved 2.5x salary growth with average post-Scaler CTC reaching ₹23L.
Google
Amazon
Microsoft
Flipkart
Adobe1200+ moreBasic Implementation of Generic Classes
Code
Output
Explanation
In the above code snippet, we have created a generic class named KeyPairVal with a type variable in the angle brackets <T, U>. The KeyPairVal class can have two private generic member variables and a generic function setPairVal that takes in two input arguments of type T and U. This allows us to create an object of keyPairVal with a type of key and the value.
The Generic Class can also implement a Generic Interface.
Turn Learning into Career Growth
Code
Output
Explanation
In the above code snippet, The generic class setKeyValue implements the generic interface KeyValueProcess. It doesn't specify the type parameters T and U, rather it allows users to set the parameters on their own. Hence, the setKeyValue class can be used with any type of key and value. A variable is defined as the generic interface with fundamental types for T and U. Therefore, we don't need to set the generic types for setKeyValue.
Conclusion
- Generics can be used to create mapped and conditional types.
- TypeScript fully supports generics as a way to introduce type-safety into components that accept arguments and return values whose type will be indeterminate when they are not written later in our code.
- Using generics correctly can save us from repeating code over and over again, and make the types more flexible.
- When the developer makes a component generic, then the component will have the ability to accept and enforce typing that improves code flexibility.
- We make use of an interface to specify properties that are used in a class.
- We can make use of the extends keyword to denote the type that has a list of properties defined in the interface.
