Typescript TS basic knowledge interface, generics

One 、 Interface

Interface is used to define an object structure , Used to define which attributes and methods should be included in an object

Use keywords interface  Definition

interface PersonObj{

  name: string

  age:number

}

const obj:PersonObj = {

  name: ' Xiao Ming ',

  age: 18,

  // gender: ' male ', // Report errors ,gender Not in the PersonObj In the definition of

}

 1. Interfaces can also be used as type declarations , Same as type

type MyType{

  name: string,

  age: number

}

const obj:MyType = { ... }

Difference ：

type Cannot declare a type with the same name twice , Will report a mistake

type MyType{ ... }

type MyType{ ... }  // Report errors

Interface interface You can declare the type of the same name twice , The result is a combination of two statements , But if there are previously declared attributes in subsequent declarations , Then the attribute type must be consistent

interface PersonObj{

  name: string

  age:number

}

interface PersonObj{

  gender:string

}

const obj:PersonObj = {

  name: ' Xiao Ming ',

  age: 18,

  gender: ' male '

} 

2. Implement the interface with class

Interfaces can be used when defining objects Restrict the structure of the object , All properties in an interface cannot have actual values , namely Interfaces only define object structures , Regardless of the actual value , Similar to abstract classes , The difference is that all properties and methods in the interface are abstract , Abstract classes can have substantial properties and methods

When defining a class , You can make a class implement an interface （ Make the class meet the requirements of the interface ）, Use keywords implements

 interface MyInter{

  name:string

  sayHi():void

}

class MyClass implements MyInter{

  name:string

  constructor(name:string){

    this.name = name

  }

  sayHi(): void {

    console.log('Hi~')

  }

}

Two 、 Generic

When defining a function or class , Encountered an ambiguous type , You can use generics , A generic type is an indefinite type , The specific type is passed in when calling

1. Specify a generic type

function fn<T>(a: T): T{ return a }

// You can call functions with generics directly

fn(10) // Do not specify generics ,TS Types can be inferred automatically

fn<string>('hello') // Specifying generics

2. Specify multiple generics

function fn<T, K>(a:T, b:K):T{

  return a

}

fn(10, 'hello')

fn<number,string>(10,'hello')

3.  Limit the scope of generics

T extends Inter For generics T Must be Inter Implementation class （ Subclass ） 

interface Inter{

  length: number

}

function fn<T extends Inter>(a:T):number{

  return a.length

}

fn('hello')

 class MyClass<K>{

  name: K

  constructor(name: K){

    this.name = name

  }

}

const myClass = new MyClass<string>('a')