TypeScript基本类型，高级类型以及工具类

介绍

1. TS是js类型的超集，在js的基础上又增加了很多特性，它支持es6的语法，支持面向对象编程的概念，如类，接口、继承、泛型等
2. 是一种静态类型检查的语言，在编译中就可以对代码进行检查校验类型

特性：

1. 类型批注
2. 类型推断
3. 接口 描述对象类型

interface Person {
    name: string,
    age: number
}

区别

• ts是js的超集，扩展了js的语法
• 只对ts进行编译

基础类型

• boolean

    let flag: boolean = false
    flag = true

• number

    let num: number = 111
    num = 222

• string

    let str: string = "hello"

• any
• array

    let arr: string[] = ["hello"]
    或
    let arr: Array<string> = ["hello"]

• tuple 元祖

1. 已知数量和类型

    let tupleArr: [number, string, boolean]

• enum 枚举

    enum Color { Red, Green, Blue}
    let c: Color = Color.Red

• null undefined null和undefined是所有类型的子类型

   let num: number | undefined
    num = 1234

• void 空类型，表示方法没有任何返回值

   function hello():void{
    alert("hello)
   }

• nerver 类型 任何类型的子类型，代表不会出现的值，一般用在一些无限循环，或者抛出异常的场景

   let a: never
   a = (()=>{
    throw new Error("wrong")
   })()

• object 类型

   let obj: object
   obj = {name: 'test'}

高级类型

1. 交叉类型

   &
   将多个类型合并成一个类型，并集 T&U

2. 联合类型 或，多个类型中的任意一个

   T | U

   number | string | boolean

3. 类型别名

   type SomeName = boolean | string

   someName就是类型别名

4. 类型索引keyof

   keyof 类似 Object.keys

   interface Button {
       type: string
       text: string
   }
   type ButtonKeys = keyof Button // "tyoe" | "text"
   

5. 类型约束extend

   type BaseType = string | number | boolean
   
   function copy<T extends BaseType>(arg: T): T{
       return arg
   }
   

   类型约束通常跟类型索引一起使用

   function getValue<T, K extends keyof T>(obj: T, key: K): T[K]{
       return obj[key]
   }
   

6. 映射类型 in

   type Readonly<T> = {
       readonly [p in keyof T]: T[p]
   }
   interface Obj{
       a: string
       b: string
   }
   type ReadOnlyObj = Readonly<obj>
   // 输出
   {
       readonly a: string
       readonly b: string
   }
   

7. 条件类型

   T extends U ? X : Y

说说你对TypeScript中接口的理解？应用场景

是什么

方法特征的集合，interface

interface Person {
    name: string
    age?: number
    readonly isMale: boolean
    say: (words: string)=>string
    [propName: string]: any
}
// 继承
interface Father {
    color: string
}
interface Mother {
    height: number
}
interface Son extends Father, Mother {
    name: string
    age: number
}

应用场景

让第三方调用的时候，知道我们的参数是什么类型，返回值是什么类型

interface IUser {
    name: string
    age: number
}
const getUserInfo = (user: IUser): string=>{
    return `name: ${user.name},age: ${user.age}`
}
getUserInfo({name: 'John',age: 30})

TS类

class 类是一种用户定义的引用类型

class Car {
    engine: string
    constructor(engine: string){
        this.engine = engine
    }
    post(): void {
        console.log("引擎"，this.engine)
    }
}

工具类

1. Record可以用来构造一个具有给定类型T的一组属性k的类型，它的定义如下

type Record<K extends keysof any, T>={
    [P in K]: T
}

type A = {
    [k: string] : number
}
// 相当于
type A2 = Record<string, number>

其余的一些例子

// 枚举类型
enum Color {red,blue}
let a: Record<Color, string> = {
    [Color.red]: 'red',
    [Color.blue]: 'red'
}

// 对象属性做key
 interface Person {
    id: number,
    name: string
 }
 type PersonInfo = Record<keyof Person, string>
 const person: PersonInfo = {
    id: '001',
    name: 's'
 }
// 有修饰符和可选项的情况
interface User {
    readonly id: number;
    name: string;
    email?: string
}
type UserMap = Record<string, User>
let userA: UserMap = {
    a: {
        id: 111,
        name: 'lily',
    }
}

2. Required

作用是将类型的所有属性变成必选

• 源码如下

    ReturnType<T extends (...args: any)=>any>

• 使用

    interface U {
        name?: string,
        age?: number,
        gender?: string[]
    }
    const c: Required<U> = {
        name: 'xiaoxiao',
        age: 20,
        gender: ['male']
    }

3. Partial 将类型的所有属性变成可选属性

• 源码

type Partial<T> = {
    [p in keyof T]?: Partial<T[p]>
}

• 使用

interface U {
    name: string;
    age: number
}
// const c:U = {
//     name:"miaoxiao"
// }
const c:Partial<U> = {
    name:"miaoxiao"
}

4. Extract

Extract<T,U>返回一个新类型，是将T中那些能够赋值给类型U的值提取出来，构成新类型

• 源码

type Extract<T,U> = T extends U ? T : never

• 使用

// 我们定义一个类型MyType,它包含了字符串类型，数字类型和布尔类型
type MyType = string | number | boolean
// 然后用Extract工具类型从MyType中提取出字符串类型，生成一个新的类型
type newType = Extract<MyType, string> // newType的类型为string

5. Exclude 移除联合类型中的某些类型，用Exclude<T, U>,表示从T中移除U

• 源码

type Exclude<T,U> = T extends U ? never: T

• 使用

type U = Exclude<"string" | "number" | "boolean","number"> // "string" | "boolean"

6. Pick

Pick<T, K extends keyof T> 的作用是从类型中挑出某些属性，变成一个新的类型

• 源码

type Pick<T,K extends keyod T> = {
    [p in K] : T[p]
}

• 使用

type U = {
    name: string,
    age: number,
    gender: string
}
type T = Pick<U,"age"|"gender"> // { age: number,gender: string}
const u1:T = {
    age: 30,
    gender: "male"

6. Omit

它的作用是从类型中移除一些类型，Omit<T,U>从T中取出除去U的其它所有属性

• 源码

type Omit<T,K extends keyof any> = Pick<T,Exclude<keyof T, K>> 

• 使用

type U = {
    name: string,
    age: number,
    gender: string
}
type T = Omit<U,"age"|"gender"> // { name: string}
const u1:T = {
    aname: "xiaoxiao"