Generic in Typescript
Generic is used to create a component that works with various data types.
It allows the users to use flexible data types of their choice. In typescript we need to write type parameter between the <T>
Note : Generic gives us power to pass a range of types to components.
How many ways can we use generic ?
a)Generic class
b)Generic function
c)Generic method
d)Generic Interface
What are the advantages of generic in Typescript ?
Ans : Following advantages :
a)Single Type : We can hold a single type of object in Generic. It does not allow you to store another object.
b)No type casting required. As the user can use any data type of their choise
c)Code gets checked at compile time
Let us understand by example :
function something(data: string): string {
return data;
}
Note : calling function with string argument will work fine
var output = something(“Mohana”);
console.log(“The output is “, output);
Note : calling function with number argument will give error
var output2 = something(121); Error , because we already defined the argument is of string type
Note : Above function will not work for the number type. That’s why above program is not generic. It should not work for any data type
Solution : The solution is to make the function as generic
function somethingAgain<T>(data: T): T {
return data;
}
var output3 = somethingAgain<string>(“Andrew”); //correct
var output4 = somethingAgain<number>(121); //correct
Note : Above function (somethingAgain) , now work for any data type
Here T defines Type. We can have multiple generic types
function somethingNormal<T, U, M, K>(a: T, b: U, c: M, d: K): [T, U, M, K] {
return [a, b, c, d];
}
var output5 = somethingNormal<string, number, string, boolean>(“Amir”, 21, “Bangalore”, true);
console.log(“The output “, output5);
Note : here we have defined the generic type as string,number,string,boolean
Generic with non generic type
function somethingAlpha<T>(firstArg: T, secondArg: string): void {
console.log(‘The data type of first arg is ‘, typeof firstArg);
console.log(‘The data type of second arg is ‘, typeof secondArg);
}
Note : Here T is generic type and string is non generic type
Generic class
class Employee<T, M, C>{
id: T;
name: M;
city: C;
constructor(id: T, name: M, city: C) {
this.id = id;
this.name = name;
this.city = city;
}
display() {
console.log(“The id is “, this.id);
console.log(“Name is “, this.name);
console.log(“City is “, this.city);
}
}
var em1 = new Employee<number, string, string>(1, “Andrew”, “Bangalore”);
em1.display();
var em2 = new Employee<string, string, string>(“2”, “Saket”, “Chennai”);
em2.display();
Note : In above program we have passed the id as number and string type respectively
Generic Interface
interface Person {
first_name: string;
last_name: string;
age: number;
}
interface Player extends Person {
game: string;
}
function displatDetails<T extends Player>(player: T): void {
console.log(“The name is “, player.first_name + ” “ + player.last_name);
console.log(“Age is “, player.age);
console.log(“Game is “, this.game);
}
var playerInfo: Player = {
first_name: “Antony”,
last_name: “Borwell”,
age: 25,
game: “Football”
}
displatDetails(playerInfo);
Generic constant with class
class Person {
id: number;
name: string;
age: number;
constructor(id: number, name: string, age: number) {
this.id = id;
this.name = name;
this.age = age;
}
}
function show<T extends Person>(per: T): void {
console.log(“Person name “ + this.name);
console.log(“Person age “ + this.age);
}
var person1 = new Person(1, “Mohan”, 21);
show(person1);
