哎呀,interface和type这个老话题,真是每过一阵子就得拿出来聊聊。网上那些文章吧,要么说得太浅,要么列一堆表格搞得像期末考试。今天我试试用咱们写代码的实际感受,把这事儿唠明白。
![图片[1]-interface和type的区别?-速码派](http://www.sumapai.com/wp-content/uploads/2026/01/f49bcb00e3be4fd2916138178347f383_tplv-tb4s082cfz-aigc_resize_1080_1080-1024x683.webp)
先打个比方,interface像是一份正式合同。它特别擅长给对象和类“塑形”。你定义一个User接口,那就立下规矩了,后面但凡说自己是User的,都得长这个模样。
interface User {
id: number;
name: string;
}
这份合同还有个好处,能“续签”和“补充”。你可以在项目别的地方,再声明一个同名interface,TypeScript会聪明地把它们合并起来。
interface User {
email?: string;
}
现在User自动就有了id、name和email三个属性。这个特性在给第三方库或者全局Window对象打补丁的时候,简直救老命了。不过这也是双刃剑,如果到处乱合并,维护起来也挺头疼。
type呢,感觉更像是一个万能工具箱,或者说是给类型起外号。它不光能描述对象,还能玩出更多花样。比如这个:
type ID = number | string;
type Point = [number, number];
看见没?联合类型、元组类型,type都能轻松搞定。它还能用&来组合类型,虽然interface也能用extends,但type的交叉类型在组合一些奇怪结构时更灵活。
type Named = { name: string };
type Aged = { age: number };
type Person = Named & Aged;
那到底该用哪个?别急,我的经验是,先别硬记区别,想想你当下在干嘛。
如果你在玩面向对象那一套,比如定义类的契约,或者这个结构未来很可能要通过extends被继承,那闭着眼睛选interface。它的语义更清晰,就是“我要定义一个可以被实现的接口”。
如果你要定义的东西不是什么“对象形状”,而是一个联合类型、一个映射类型、一个从现有类型里计算出来的新类型,或者就是一个简单的类型别名,那type绝对是你的主力工具。
性能上?现代TypeScript编译器处理它们基本没差别,不用担心这个。
实际干活的时候,别把它们当成二选一的单选题。我自己的项目里经常混着用。比如用interface定义核心的业务实体,因为它们清晰且可扩展;用type来定义一些工具类型、组件Props的联合状态,或者复杂的配置对象。有时候甚至一个类型先用type定义,后面发现需要被类实现,再轻松地改成interface,大部分代码都不需要动。
说到底,这俩家伙的共同目标都是让你的类型系统更健壮。纠结的时候,记住一条:团队约定大于个人习惯。只要团队里统一,用哪个都不会是项目的短板。



























暂无评论内容