Interface
描述:用来描述对象的形状,能够被扩展
常用语法 ( Common Syntax )
1. 描述普通对象
interface JsonResponse { version:number; outOfStock?: boolean; readonly body: string; update: (retryTimes: number) => void; update2(retryTimes: number):void } interface JsonResponse2 { [key: string]: number }
2. 描述函数
上个例子中,我们描述的是一个对象中拥有的一些属性。Interface 也可以直接来描述一个函数。
因为在 JS 中,一切皆是对象,函数在 JS 中也是对象,可以拥有属性,并且可以被调用。
interface JsonResponse { (): string; toFn: string } const fn: JsonResponse = () => { return 'str' } fn.toFn = 'content'
3. 描述构造函数
还未搞懂…,有看到此随笔的朋友,推荐下相关链接,感谢
4. interface 的扩展
// 接口扩展接口 interface X { x: number } interface Point extends X { y: number } // Point {x:numer;y:number} // 也可扩展类型别名,同时可扩展多个 type Y = { y: number } interface Point2 extends X, Y { z: number } // Point2 {x:numer;y:number;z:number}
接口重名也会扩展,后续属性声明必须属于同一类型,否则报错!
interface Legged { numberOfLegs: number; } interface Legged { numberOfLegs: 123; } // 报错,numberOfLegs 必须都为 number // ======= 在namespace 中也是如此 namespace Animals { export interface Legged { numberOfLegs: number; } } namespace Animals { export interface Legged { numberOfHands: number; } } // 合并为 namespace Animals { export interface Legged { numberOfLegs: number; numberOfHands: number; } }
5. 附加注释,鼠标移入时编辑器会有附加注释
interface JsonResponse { version: number } interface JsonResponse { /** In bytes */ payloadSize: number }
泛型( Generics )
interface APICall<R> { data: R } // 使用 interface JsonResponse { content: string }; const api: APICall<JsonResponse> = { data: { content: 'xxx' } } api.data.content
泛型约束
// 意味着要有 status 属性的类型才能使用 interface APICall<R extends { status: number }> { data: R } // 使用 interface JsonResponse { content: string, status: number }; const api: APICall<JsonResponse> = { data: { content: 'xxx', status: 200 } } api.data.status
重载( Overloads )
同样未搞懂…
Get & Set
可以描述对象的自定义 get 与 set 方法
interface Ruler { get size(): number | string set size(value: number | string) } const ruler:Ruler = { size: 123 } ruler.size = 456 ruler.size = '456' ruler.size // 类型为 string // Error // ruler.size = false
例子中 size 属性只能赋值 number 和 string 类型,由于第二次赋值为字符串,所以TypeScript自动推断返回值为 string,并不是 number | string
一致性类 (Class conformance)
可通过 implements 关键字来确保类的一致性
interface Syncable { sync(): void } class Account implements Syncable { sync() { } } // 必须实现 sync 方法
感谢观看,欢迎互相讨论与指导,以下是参考资料链接
https://itdw.cn/wp-content/uploads/2022/12/257304-wpLb6p.png?imageMogr2/thumbnail/1330×940
© 版权声明
文章版权归作者所有,未经允许请勿转载。
版权声明:
1、IT大王遵守相关法律法规,由于本站资源全部来源于网络程序/投稿,故资源量太大无法一一准确核实资源侵权的真实性;
2、出于传递信息之目的,故IT大王可能会误刊发损害或影响您的合法权益,请您积极与我们联系处理(所有内容不代表本站观点与立场);
3、因时间、精力有限,我们无法一一核实每一条消息的真实性,但我们会在发布之前尽最大努力来核实这些信息;
4、无论出于何种目的要求本站删除内容,您均需要提供根据国家版权局发布的示范格式
《要求删除或断开链接侵权网络内容的通知》:https://itdw.cn/ziliao/sfgs.pdf,
国家知识产权局《要求删除或断开链接侵权网络内容的通知》填写说明: http://www.ncac.gov.cn/chinacopyright/contents/12227/342400.shtml
未按照国家知识产权局格式通知一律不予处理;请按照此通知格式填写发至本站的邮箱 wl6@163.com
1、IT大王遵守相关法律法规,由于本站资源全部来源于网络程序/投稿,故资源量太大无法一一准确核实资源侵权的真实性;
2、出于传递信息之目的,故IT大王可能会误刊发损害或影响您的合法权益,请您积极与我们联系处理(所有内容不代表本站观点与立场);
3、因时间、精力有限,我们无法一一核实每一条消息的真实性,但我们会在发布之前尽最大努力来核实这些信息;
4、无论出于何种目的要求本站删除内容,您均需要提供根据国家版权局发布的示范格式
《要求删除或断开链接侵权网络内容的通知》:https://itdw.cn/ziliao/sfgs.pdf,
国家知识产权局《要求删除或断开链接侵权网络内容的通知》填写说明: http://www.ncac.gov.cn/chinacopyright/contents/12227/342400.shtml
未按照国家知识产权局格式通知一律不予处理;请按照此通知格式填写发至本站的邮箱 wl6@163.com