Understand generics in context

Requirement: define a method that creates an array of specified length and can fill the array with any specified contents

Method 1: Use any type

let getArray = (value:any.items:number = 5) :any[] = > {return new Array(items).fill(value);

};

let arr1 = getArray("abc".3);//['abc','abc','abc']

let arr2 = getArray(6.3);/ / filling [3]

let res = arr1.map(item= >item.length); / / edit without prompt item. Length [' ABC ', 'ABC' and 'ABC'] = > [3, 3, 3]


Copy the code

Current storage problems:

1. Write code without prompting, because TS static detection does not know what type

2. Even if the code is written wrong, it will not report the error, because the static check does not know the specific type of TS

Method 2: Use generic < T >

By losing code hints and editing errors, you lose the full power of TS. To solve this problem, typescript introduces generics

let getArray = <T>(value:T, items:number = 5):T[]=>{

  return new Array(items).fill(value);

};

let arr = getArray<string> ('abc');

// let arr = getArray<number>(6);

// Note: The specific type of the generic type may not be specified

// If not specified, it is automatically derived from the generic arguments we passed

let arr = getArray('abc');

// let arr = getArray(6);

let res = arr.map(item= >item.length);

console.log(res);


Copy the code

What are generics?

(1) Understand generics through action

  • Used to compensate for any’s lack of syntax and error reporting.

  • We do not specify the type at first, and then determine the type based on the type we pass in.

(2) Method of use

Function getArray(value:T,length:number=5):T[]{function getArray(value:T,length:number=5):T[]{

​ return new Array(items).fill(value);

}

Generics specify the type passed in, written before the function ();

The return result type specifies the outgoing type of the function, written after function ();

Let arr = getArray(‘ ABC ‘);

Specify the type before () of the calling function expression

Generic constraints

By default we can specify a generic type as any type, but in some cases we need to specify a type that meets certain conditions

At this point we can use generic constraints.

// Requirement: The specified generic type must have the Length attribute

interface LengthInterface{

  length:number

}

let getArray = <T extends LengthInterface>(value:T, items:number = 5):T[]=>{

  return new Array(items).fill(value);

};

let arr = getArray<string>('abc');

// let arr = getArray<number>(6);

let res = arr.map(item=>item.length);
Copy the code

Ts Introduction Notes Directory:

TS Introduction Note 1 – Type declarations for TS

TS Introduction Note 2 – TS interface further details

TS Introduction Note 3 — Function declarations in TS

TS Introduction Note 4 — Type Assertion for TS (Interpreted type conversions)

TS Introduction Note 5 – TS generics

TS Introduction Note 6 — Declaration files, modules, namespaces in TS

Record knowledge, transfer happiness ~

If my summary is helpful to you, please give me a thumbs up. Your encouragement is a great motivation for me to keep recording

If there are any errors in this article, please feel free to point them out in the comments