Detailed Introduction to TypeScript Basics (2)

4. TypeScript Advanced Types

insert image description here

4.1 class class

There are two ways of class inheritance: 1 extends (inherit parent class) 2 implements (implement interface).

Class member visibility: You can use TS to control whether a method or property of a class is visible to code outside the class.
public
protected
private
readonly
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here

4.2 Type Compatibility

insert image description here
insert image description here

insert image description here

insert image description here

insert image description here
insert image description here

insert image description here

4.3 Cross Types

insert image description here
insert image description here

4.4 Generics

insert image description here

insert image description here

insert image description here

insert image description here

insert image description here

insert image description here

insert image description here

insert image description here
insert image description here
insert image description here

insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here

4.5 Index signature type

insert image description here

insert image description here

4.6 Mapping Types

insert image description here
insert image description here

insert image description here

insert image description here

insert image description here

5. TypeScript type declaration file

insert image description here

5.1 Two file types in TS

insert image description here

5.2 Instructions for use of type declaration files

insert image description here

insert image description here
insert image description here

insert image description here

insert image description here

insert image description here

insert image description here

6. Using TypeScript with React

insert image description here

6.1 Create a TS-enabled project using CRA

insert image description here

insert image description here

insert image description here

6.2 TS configuration file tsconfig.json

insert image description here

insert image description here

6.3 Common types in React

insert image description here

insert image description here

insert image description here

insert image description here
insert image description here
insert image description here
insert image description here
insert image description here
insert image description here

Guess you like

Origin blog.csdn.net/weixin_45428910/article/details/131672792