TS中,到底用`type`还是`interface`呢?

结论

直接说结论,用type一把梭即可,接下来我一一解释

为什么定义对象都要使用type呢?

如图所示,我鼠标悬浮后,并不知道里面是什么东西

只能获取结果时调出代码提示,或者ctrl + 鼠标左键进入,查看类型定义

那么我用type呢?

可以看到,现在鼠标悬浮能直接查看类型定义了

这一点是让我最受不了的,所以直接选择type即可

区别

1. 如何继承

先看看interface,通过extends关键字

type,则通过交叉类型,都能用,不过interface我认为好看点

2. 其他特性

interface重写时

  • 如果有不同的属性,则会添加;
  • 如果是相同的属性但是类型不同,则会报错

这点有好有坏,当你不小心名字重复了,那你就容易出问题

但同时利于扩展,不过没有人会这么写吧?

直接去原来的接口添加属性不行吗?

3. type独有的优势

除了上面的悬浮能查看具体类型外,type还提供了很多的关键字使用,这是interface不具备的

比如in关键字,用来枚举类型

这里我写个删除属性的泛型,和Omit一样的,但是interface不支持

此外还有很多TS特有的关键字,都只能通过type使用,比如infer

不过这也符合直觉,因为interface就是定义一个类型而已

经过以上探讨,可以得出一个结论,那就是interface能做的,type都支持,而且做的比他更好

相关推荐
jiayong233 分钟前
Vue2 与 Vue3 常见面试题精选 - 综合宝典
前端·vue.js·面试
We་ct10 分钟前
LeetCode 383. 赎金信:解题思路+代码解析+优化实战
前端·算法·leetcode·typescript
东东51619 分钟前
OA自动化居家办公管理系统 ssm+vue
java·前端·vue.js·后端·毕业设计·毕设
周某人姓周23 分钟前
DOM型XSS案例
前端·安全·web安全·网络安全·xss
程序员鱼皮34 分钟前
前特斯拉 AI 总监:AI 编程最大的谎言,是 “提效”
前端·后端·ai·程序员·开发
pusheng20251 小时前
普晟传感2026年新春年会总结与分析
前端·javascript·html
D11_1 小时前
[特殊字符]️ 5379工具箱 - 全部网站链接汇总
服务器·百度·阿里云·typescript·编辑器
谢尔登1 小时前
React19事件调度的设计思路
前端·javascript·react.js
Emma_Maria1 小时前
本地项目html和jquery,访问地址报跨域解决
前端·html·jquery
奋斗吧程序媛1 小时前
常用且好用的命令
前端·编辑器