Presumably many children’s shoes in the daily work of light pile business, can not systematically understand TS, so in this systematic establishment of TS cognition!

Comb structure

Mind mapping address (suggest direct point past see, clear brain figure) www.processon.com/view/link/6…

type

Type annotations

  • Syntax :(variable/function) type
  • Function: Equivalent to type declarations in strongly typed languages

The base type

  • Boolean let bool: Boolean = true

  • Let num:number = 2

  • String let STR :stirng = ‘1’

  • An array of

    • Let arr:number[] = [1,2] equivalent to let: Array= [1,2]
    • Let mixArr: Array = [1, ‘1’]

  • Let num_str: [number, string, object] = [1, ‘2’, {}]

  • The object obj: {name: number | string, age: number} = {12} name: 1, the age:

  • Let sym:symbol = symbol ()

  • Function add (x: Array, y: string): string {return x + y}

  • undefined let un:undefined = undefined

    By default null and undefined are subtypes of all types. That is, you can assign null and undefined to variables of type number.

  • null let nu:null = null

  • Void means there is no type

    Void: function warnUser(): void {console.log(‘This is my warning message’); void: warnUser(): void {console.log(‘This is my warning message’); } Declaring a void variable doesn’t do much good because you can only give it undefined and null.

  • any

    Any type is not recommended

  • never

    The never type returns no value type (an infinite loop, an exception function thrown, etc.), is a subtype of any type, and can be assigned to any type; However, no subtypes of type never can be assigned to type never (except never itself). Even any cannot be assigned to never.

  • Object

    Object represents a non-primitive type, that is, a type other than number, string, Boolean, symbol, NULL, or undefined.

Enumerated type

Enum Cla {name = 2, age} Enumerator properties: Cannot change the member, only readable enumerator types can be of three forms: STR {str1 = ‘fwe’} enum Pa {b, // a = str.str1, // c = 2, // expression d = math.random ()} console.log()

  • Digital enumeration

    Implementation principle: Reverse mapping enum Num {ops}

  • String enumeration

    Enum Str {str1 = ‘fwe’}

  • Heterogeneous enumeration

    Enum St{a, b = ‘2’}

  • Constant enumeration

    Enumeration declared with const; Function: Used when only the value of an object is needed

    • Features: Removed at compile time

Interface

Function: to play a limiting and normative role

Object type interface

Example: Define the list array returned in the background:

interface List { readonly name: string, age: number } interface Data { res: List[] } let data = { res: [ { name: '333', age: 111 } ] } function des (data: Data) { data.res.map((x) => { console.log(x) // {name:'333',age:111} }) } des(data) If the array returned by the background contains fields not defined in interface, such as the ops field res: [{name: '333', age: 111, OPS: 988}], then we need to skip its type checking. Des ({res: [{name: '333', age: 111, OPS: 988}]} as Data) 2. Use optional operators: interface List {name: string, age: number, ops? Interface List {name: string, age: number, [x:string]: string {name: string, age: number, [x:string]: string} Any} * Index-typed interfaces can be used if you are unsure of the data type in the interface (string/number, where numbers are subtypes of strings)Copy the code

Indexable type signature interface

// Indexable type signature Interface strAr {[index: number]: number} let ar: strAr = [1] * The numeric indexable value must be a subtype of a string

Function type interface

  • Let get: (x: string,y: number) => string

  • Interface get {(x: string, y: number): string}

  • Type alias type definition: type get = (x: string,y: number) => String

    Type: Instead of creating a new type, it just gives a name to a given type. Type can be combined, crossed, and more succinctly referenced. Interface: Creates a new type. Interfaces can be inherited or merged.

Interface Dos {(): any, q: string, dosGO(): any}let dosHandle: Dos = (() => {}) as dosdoshandle.q = ‘111’ doshandle.dosgo = () => {alert(9)}* Type inference is required

function

Function parameter type definition

Function kops(x: string, y? :number){}… Rest uses Function rests(x: number… Rest: Array) : any | void {return x + rest. Reduce ((x1, y1) = > x1 + y1)} let the result = rests (1, 2) the console. The log (result) / / 3

Function overloading

  • Concept: Two functions are named the same, but have different parameters, numbers and types. Benefits: Use the same named function to achieve similar functions, solved: there is no need to use different function names for similar functions
  • Function testNumber(…); function testNumber(…); function testNumber(… rest: Array): numberfunction testNumber(… Rest: Object []): object uses the two types of function overloading defined above: function testNumber(… rest: any): any { if(Array.isArray(rest[0])) { console.log(rest[0][0].name) // ops } else { console.log(rest.reduce((x: number, y: number) => x + y)) // 6 }}testNumber([{name: ‘ops’}], {})testNumber(1, 2, 3)
  • 1. Function testNumber(… rest: Array): number2. function testNumber(… rest: object[]): object