当前位置: 首页 > Web前端 > JavaScript

TS中的接口和类型

时间:2023-03-26 23:21:53 JavaScript

TS中interface和type怎么用,有什么区别?1、最常见的接口是:对象类型接口;1、对象类型接口用于定义对象的类型:interfaceIPerson{name:string;age:number;}lettom:IPerson={name:'Tom';age:25;}接口中未定义的属性不能在对象中使用,会报错;对象的属性数必须与接口的属性数完全相同,除非'?'的可选属性用来;对象接口的几个属性:interfaceIPerson{name:string;——>determinedattributeage?:number;——>optionalattributereadonlyid:number;——>read-onlyattribute}注意:一旦使用了任何属性,那么确定的属性和可用的所选属性的属性值类型必须是任何属性值类型的子集(一致或子集);例如:if[propName:string]:string,thenage?:number会报错5.只读属性只能在定义接口类型时在Assign中使用,比如在接口中,但不能在别处重新赋值(因为它是一个只读属性,不能重新分配);接口FullName{firstName:string;secondName:string;}functionprintName(name:FullName){console.log(name.firstName);}letobj={//传入的参数必须包括firstName和secondName,但可以有其他参数;//如果传入直接会报错,只能是firstName和secondName,不能包含其他;age:20,firstName:'张',secondName:'三'};printName(obj);//2.函数类型接口:interfaceencrypt{(key:string,value:string):string;}letmd5:encrypt=(key:string,value:string):string=>{returnkey+value;};console.log(md5('name','zhangsan'));两个.type是类型别名,是针对类型要创建新名称,必须使用类型来定义新名称;如:typeName=string;如:键入a=string|数字;如:typeNameResolver=()=>string;这里的'=>'不代表一个箭头Function,箭头左边表示形参,右边表示返回值;类型别名,常用于联合类型,如:typea=string|数字;使用'typeofvariable'获取变量的类型;类型别名和字符串文字类型必须使用类型定义;