TypeScript:常用类型约束

JS已有的数据类型如number、string、null....但并没有进行类型限制

所以,TS在支持JS全部类型的类型注解基础上,自己还加了一些新类型和新类型注解。

JS已有类型

基础类型:number , string ,boolean , null, undefined, symbol
对象类型:object(数组,对象,函数等)

TS新增类型

  1. 联合类型:

let ages: (number | string)[] = [1,'1',2,'2']

  1. 类型别名:类型别名严格上说不是一种类型,而是给类型取个别名而复用而已

type NumberAndString = (number | string)[]
let ages: NumberAndString = [1,'1',2,'2']
let ages: NumberAndString = [3,'3',4,'4']

  1. 接口: 相当Java的接口定义
interface User{
	name: string
	age: number
	sayHi(){}
}

使用:

let user: User = {
user: 'zhangsan',
age: 19,
sayHi(){}
}

  1. 元组:规定了数组长度及元素类型的数组。说白就是数组,不过是有约定条件的数组
let postion: [number,number] = [19,20]
  1. 字面量类型: 这个类型有点搞人,还能这样的?此类型看这篇文章讲解:

https://www.cnblogs.com/ibcdwx/p/17317592.html

  1. 枚举:和Java差不多
enum Dicretion {UP, DOWN, LEFT, RIGHT};

function changeDicretion(dicretion: Dicretion):void{

};

changeDicretion(Dicretion.UP);

枚举如果不指定值,TS会自动帮你从0依次赋值,我们也可以手动指定值,如下:

enum Dicretion {UP = 10, DOWN = 20, LEFT = 30, RIGHT = 40};
  1. void:无需返回值
  2. any: 数据可以是任何类型,不约束。这个类型不推荐使用,此类型的主要作用就是当你没有写类型约束时,默认any。

JS对象类型细化

在JS中,不管是数组还是对象都是用object,而在TS做了细化的类型约束。

数组类型

let ages: number[] = [1,3,4]
let ages: string[] = ['1','3','4']

函数

JS函数是没有如入参和出参做类型限制的,TS则有:

funtion add(num1: number,num2: number): number{
return num1 + num2;
}

funtion add(参数名1: 类型1,参数名1: 类型2): 返回值类型{
}

上面举例参数是基础类型,对象类型里的属性也可以限制:

funtion add( user:{name:string; age:number} ): void{
}

箭头函数

在ES6里,为了更加简化函数的写法,就有了箭头函数:

const add = (num1,num2) => {
	
}

TS也可以对函数类型进行限制:

const add = (num1: number,num2: number): number => {
	
}

对象类型

ES6创建一个对象是这样的:

let add = {
	name: 'zhangsan',
	age: 18,
	sayHi(){
		
	},
	say(lang){
		return lang;
	}
}

TS创建对象时,可限制创建时的类型:

let add: { name:string; age:numver; sayHi():void; say(num:string):string }= {
	name: 'zhangsan',
	age: 18,
	sayHi(){
		
	},
	say(lang){
		return lang;
	}
}
posted @ 2023-04-14 11:34  爱编程DE文兄  阅读(222)  评论(0编辑  收藏  举报