This is the seventh day of my participation in the August More text Challenge. For details, see: August More Text Challenge

What is a generic? Why use generics? Let’s look at a couple of examples

Generic function

Suppose you have a requirement to implement a method that returns a value of the same type as the type parameter passed in. For example, if you pass a string, you must return a string; The first thing we might think of is using method overload overload description to define all the possibilities. Here’s how to write method overloading:

overloading

	function reLoad(arg: string) :string;
	function reLoad(arg: number) :number; . .function reLoad(arg: any) :any {
		return arg
	}
Copy the code

Even if you consider everything, you may miss some types. Or in the future, the syntax extension will have new types and need to come back. And there’s a lot of overloading code and it looks complicated; If you use the any type to restrict it, the requirement will not be met. This can be implemented using generics:

The generic

Here’s an example:

function fn<T> (arg: T, arg2: string) :T {
	return arg;
}
fn(1); 		
fn('123');
fn(true);
Copy the code

This is a general term, not a fixed one. It can be string/number/ Boolean and so on; What type is the argument that you pass in when you call it, and you know what type it is. The number type passed in the first call in the example above will be recognized as number. The return value must also be of type number. Note: T is just a common name, not necessarily called T. We can also change it to U or other English letters.

Generic interface;

Change the generic function mentioned above to an interface. Take a look at how to use generics in an interface:

Methods a

interface InterFn {
	<T>(arg: T, arg2: string): T
}
let fn: InterFn = function (arg, arg2) {
	return arg
}
console.log(fn(1.' '))
console.log(fn<number>(1.' '))
Copy the code

In addition to calling the fn method by analogy, we can also specify the type in <> directly. If fn is passed in, it must be of type number;

Method 2

We can also preposition generic identifiers

interface InterFn<T> {
	(arg: T, arg2: string): T
}
let fn: InterFn<string> = function (arg, arg2) {
	return arg
}
console.log(fn('1'.' '))
console.log(fn<string>('1'.' '))	//Expected 0 type arguments, but got 1
Copy the code

For pre-declared interfaces, you must specify the specific type of the generic type for the function name when declaring a function by reference to the interface. For example, let fn: InterFn make sure that valid types are passed in and cannot be changed during the invocation.

Methods three

The following method declares the name of the function and the name of the called function.

interface InterFn<T> {
	(arg: T, arg2: string): T
}
function fn2<T> (arg: T, arg2: string) {
	return arg
}
let fn: InterFn<string> = fn2
console.log(fn2('1'.' '))
console.log(fn2<number>(1.' '))
//
console.log(fn('1'.' '))
console.log(fn<string>('1'.' '))	//Expected 0 type arguments, but got 1
Copy the code

Call method based on fn2 method. The interface is used in the fn method. The complex version of the second method is also preceded by generic types, and the exact type is declared when the interface is called. The type cannot be changed again when the fn method is called later.

A generic class

Generics allow for code reusability; And reusability; Support for uncertain data types;

A generic class

class Cl<T>{
	list: T[] = [] 
	list2: Array<T> = []      
	run(arg: T): T {
		return this.list2[1];
	}
	run2: () = > T
}
Copy the code

The above example adds a generic identifier after the class name, and both lists are generic arrays. Methods are also generic functions.

Class substitution interface

class Cl1{
        name:string | undefined;   
        pwd:string | undefined;
}
class Cl2<T>{				
        run(arg:T):any{           
                console.log(arg)
                returnarg; }}let c1 = new Cl1();
c1.name = 'name';
//let c2 = new Cl2();
let c2 = new Cl2<Cl1>();
alert(c2.run(c1))
Copy the code

This example sees Cl1 classes being used as interfaces; Interfaces and classes are objects, and this part of the basic source code reading is sufficient. There are opportunities to expand

TS (TypeScript) basic knowledge: Data type (variable) declaration basic knowledge: TS (TypeScript) Basic knowledge: Function specification and TypeScript class Basic knowledge: Interface (interface)