interface和type的区别?

哎呀,interface和type这个老话题,真是每过一阵子就得拿出来聊聊。网上那些文章吧,要么说得太浅,要么列一堆表格搞得像期末考试。今天我试试用咱们写代码的实际感受,把这事儿唠明白。

先打个比方,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,大部分代码都不需要动。

说到底,这俩家伙的共同目标都是让你的类型系统更健壮。纠结的时候,记住一条:团队约定大于个人习惯。只要团队里统一,用哪个都不会是项目的短板。

© 版权声明
THE END
喜欢就支持一下吧
点赞8 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容