TS日常类型

最近公司开发的项目中要求使用typeScript，于是在使用的过程中对typeScript的日常类型的使用进行了整理。

一、基础类型、数组

基础类型：string，number，boolean，null(人为赋空值)，undefined

eg：const a:{[key:string]:number} = {x:1}  定义key为字符串  value为number

数组类型：定义数组包含的数据类型，Array<T>或者T[]，T代表数组中元素类型 eg：let arr = new Array<string>()或者let arr = string[]

二、any/unkown

any:不做任何类型检查，取消了这个变量的类型保护

unkown:不知道是什么类型，那么这个值可以是任何类型，严格版的any

注意：不可以把unkown类型的变量赋值给任何除了any，unkown类型的变量

三、函数（:function）

1.声明一个函数属性

type func = {eat:function(name:string):string}等或者void  void代表没有返回值}

或者type func = {eat:(name:string)=>string}

2.TS如何知道匿名函数的类型：

Contexture  Typing技术：根据上下文（Context）推导类型

四、对象类型（object和Record<string,any>）

1）typeScript里有三个类型比较难区分，就是object、Object、{}

object不能接受原始类型，其余两个可以，{}是个空对象，没有索引。

2）对象类型可选成员（?）

eg：function printName(obj：{first:string，last?：string})

六、联合(|,类型的联合代表类型的公共部分，其通用部分存在)

eg：function printId(id:number | string) 当使用id.tofixed()方法时会报错

可以使用类型的窄化技术：

eg：function  printID(id：number |  string ){

       if(typeof.id === 'number'){

             id.toFixed()

              return

     }

     id.toUpperCase()

}

七、别名（type）

  eg：   type  Point = {

               x:number,

               y:number

    }  或者  type  ID = number  |  string(联合类型的别名)

const  pt：Point = {x:100,y:100}

八、接口(interface)

eg：   interface  Point = {

               x:number,

               y:number

    } 

const  pt：Point = {x:100,y:100}

别名和接口的区别：

在类class的类型定义中我们使用接口interface来做，在定义简单类型、联合类型、交叉类型、元组时我们用类型别名type来做，并且它和typeof能够天然的结合在一起使用。在双方都能实现的区域，它们的区别不大

1)、继承时的写法：

interface  Animal {name:string}

interface Bear  extends Animal{honey:boolean}

type Animal ={name:string}

type Bear = Animal & {honey:boolean}

2）、接口可以合并声明

interface  Box{height:number}

interface Box {scale:number}

let box：Box = {height:5,scale:10};

功能类型，

九、断言(类型的断言as)

1.当TS对类型的理解没有用户深刻时：const myCanvas = document.getElementById("main_canvas') as HTMLCanvasElement;

2.非空断言运算符(!)可以明确的告诉编译器一个表达式的值不是null或undefined

//明确告诉ts a标签肯定存在
const link = doucument.querySelector('a')!;

十、字面类型

const  someStr = 'abc'  //类型为字符串abc 而不是 字符串

let  someStr = 'abc'  // 类型为字符串

十一、null and undefined

null代表人为（逻辑）空值

undefined代表值没有被定义

十二、枚举类型（enum）

enum Direction {

          UP = 1,

          DOWN

}

和联合类型相似（type  Dir = "UP" | "DOWN"）

十三、keyof any

1.keyof any可以动态获取key支持的类型，根据keyofStringsOnly的编译选项，可以用来约束索引

2.当keyofStringsOnly开启了那么就只会用string作为索引，否则才是string|number|symbol

3.当需要约束某个类型参数为索引key时，可以直接使用keyof any   

十四、Record

1.内置类型,它的作用是根据传入的索引和值的类型构造心的索引类型

2.当约束索引类型时可以使用Record<string,any>来代替object，Record<string,any>创建了一个key为string类型，值为任意类型的索引类型

十五、映射类型语法

type  ToProps<T> = {  [Key in keyof  T]?:T[Key]  }

type  Props = ToProps<{name:string;age:number}>

最后会得到：

type Props = {name?:string; age?:number }