TS基础知识点 | 青训营笔记

这是我参与「第四届青训营 」笔记创作活动的第4天,以下内容就是我关于TS所总结的一些知识点 TypeScript发展历史

TS 与JS的相同点与不同点

• Ts是静态类型，JS是动态类型
• 都是弱类型语言

TS特性所带来的优点：

• 可读性强：基于语法解析TSDoc，ide增强
• 可维护性强：在编译阶段就会检测错误，有利于大型项目的开发
• 包含于兼容所有JS特性，支持共存

数据类型

---

基础数据类型

/* 字符串 */
const q:string ='string'
/* 数字 */
const w:number =1;
/*布尔值 */
const e:boolean = true;
/* null */
const r:null = null;
/* undefined */
const t:undefined = undefined

对象数据类型

• 使用关键词interface来定义一个对象,一般都是会有I作为前缀

interface IBytedancer{
		readonly jobId :number;
		name: string;
		sex: 'man' | 'woman' | 'other';  //联合类型
		age：number;
		bobby?:string;  //可选属性
		[key:string]:any;  //可以用来约束该对象的所有类型
}

函数类型

• 在参数后补充类型，以及补充返回值类型

• 可以用interface定义函数

interface IMult{
		(x:number,y:number):number;
}
const mult:Imult = (x,y)=>x*y

• 函数重载：多个函数公用同一个函数名，但是参数不同

数组类型

可以通过type，泛型，元组，接口的方式来定义

枚举类型

作用：用于一些属性只能被设定为一定数量的可能值

enum EnumExample{
		add = '+',
		mult = '*'
}
EnumExample['add']==='+';
EnumExample['+'] === 'add';
//同时还支持正反映射

泛型

作用：不预先指定具体的类型，而是在传入类型的时候，再指定类型，是一种变量指代

//在传入类型后，返回相应类型的数组
type IGetRepeatArrR = <T>(target:T)=>T[];

//多泛型
interface IX<T,U>{
	key:T;
	val:U;
}

• 泛型约束以及泛型默认参数：对于泛型进行一个类型约束

type IGetRepeatStingArr = <T extends string>(target:T)=>T[];

//在没有传入类型时，默认为number
type IGetRepeatArr <T=number>=(target:T)=>T[]; 

类型断言

作用：编译时无法确认类型，但是类型却又很明确的情况下，直接使用断言将一个变量类型判定为指定类型

高级类型

联合/交叉类型：

联合类型： IA | IB，表示一个值可能是几种类型之一

交叉类型: IA & IB,表示一个值必须包含所有的类型

例子：为书籍定义两种类型，一种是包含主题的，另一种是包含出版日期的

type  IBookList=Array<
		{author:string;}&
		({
				type:'history';
				range:string;
			}|
		 {
			type:'story';
			theme:string
		 }
			)
>

类型保护

应用场景：当传入的参数是联合类型的时候，可以定义一个函数来判断类型

或者使用typeof来判断

//类型守卫
function getIsIA(arg:IA | IB):arg is IA{
		return !!(arg as IA).a;
//返回的 is是一个类型谓词
}
//typeof 或者 instance类型保护
if(typeof target ==='string'){}
if(target instanceof Object){}

定义一个类型的子集

type IPartial<T extends Record<string,any>> ={
		[P in keyof T]?: T[P];
// keyof 相当于取了对象所有的字面量
// in 表示取字面量中的某一个可能
}