TypeScript:常用类型约束
JS已有的数据类型如number、string、null....但并没有进行类型限制
所以,TS在支持JS全部类型的类型注解基础上,自己还加了一些新类型和新类型注解。
JS已有类型
基础类型:number , string ,boolean , null, undefined, symbol
对象类型:object(数组,对象,函数等)
TS新增类型
- 联合类型:
let ages: (number | string)[] = [1,'1',2,'2']
- 类型别名:类型别名严格上说不是一种类型,而是给类型取个别名而复用而已
type NumberAndString = (number | string)[]
let ages: NumberAndString = [1,'1',2,'2']
let ages: NumberAndString = [3,'3',4,'4']
- 接口: 相当Java的接口定义
interface User{
name: string
age: number
sayHi(){}
}
使用:
let user: User = {
user: 'zhangsan',
age: 19,
sayHi(){}
}
- 元组:规定了数组长度及元素类型的数组。说白就是数组,不过是有约定条件的数组
let postion: [number,number] = [19,20]
- 字面量类型: 这个类型有点搞人,还能这样的?此类型看这篇文章讲解:
- 枚举:和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};
- void:无需返回值
- 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;
}
}