五 typescript学习之路 —— ts的接口( 三 )


缺少任意一项就会出现额外类型检查的错误
接口对函数的约束
函数式js的一等公民,它也是对象,因此,接口对函数也是起作用的,让我们来看个例子
interface PrintFullName {(firstName: string, lastName: string): string}const printFullName: PrintFullName = (firstName, lastName): string => `${ firstName } ${ lastName }`printFullName('爱新觉罗', '小胖纸') // 爱新觉罗 小胖纸
这里我们使用(: , : ) => 来对函数的传入参数和返回值类型进行约束,传入参数是类型,返回值也是类型
另外需要注意的是,函数类型的接口,只检查对应参数的值类型,而不需要值相等
const printFullName: PrintFullName = (str1, str2): string => `${ firstName } ${ lastName }`
你也可以给参数指定类型和函数的返回值不指定类型
const printFullName: PrintFullName = (str1: string, str2: string) => `${ firstName } ${ lastName }`
一般而言,函数类型在定义函数时我们是不需要指定返回值类型的,ts解析器能够推断出来
还有对于函数类型的接口约束推荐使用type类型别名来定义,上面的列子我们在改写下
type PrintFullName= (firstName: string, lastName: string) => string
接口的混和类型
对于对象而言,我们可以定义属性,那么我们是不是也可以定义方法,答案当然是阔以了 。比如
// 定义一个对象,里面包含属性和方法interface PrintInfo {userName: string(age: number): voidprint(): void}const printInfo = (): PrintInfo => {const p = (age: number) => { console.log(`${ age }`)}p.userName= '小胖纸' // 主要这里不能是name 设为name则是想改掉函数本身自带的name属性p.print = () => {}return p}let p = printInfo()p(22) // 22p.userName // 小胖纸p.print() // // 或者这么写const printInfo = (): PrintInfo => {let p = ((age: number) => { console.log(`${ age }`)})p.userName= '小胖纸' // 主要这里不能是name 设为name则是想改掉函数本身自带的name属性p.print = () => {}return p}
类可以实现接口
如果你希望在类中使用必须要被遵循的接口(类)或别人定义的对象结构,可以使用关键字来确保其兼容性
interface FullName {firstName: stringlastName: string}class Name implements FullName {firstName: stringlastName: string}
上一章 学习之路(四) —— ts类的继承(包含es5以及es6的类继承)
【五typescript学习之路 —— ts的接口】下一章学习之路(四) —— 函数