网站首页 > 技术文章 正文
最近本文作者在用typescript开发代码时发现接口interface和类型别名type用法很像,这篇文章我们就来聊聊这两个用法的异同点。
异同点
从图1中我们发现接口interface和类型别名type在定义一个普通的对象类型时没啥区别,泛型都能照常用。
如果我们定义一个简单类型呢?
如图2所示,像这样的简单类型的定义,type用起来就很随意,但是interface恐怕就无法做到了。
如图3,它们两都可以轻松实现一个函数的类型,写法稍微有点区别,但是它们都能被类class实现吗?
如图4所示,接口interface可以被一个类class实现(implements),但是类型别名是不行的。
类型别名type不但不能被extends和implements,就连自己也不能extends和implements其它类型,好在我们可以用交叉类型代替extends来达到同样的效果。
说到这里,你就会发现type可以使用联合类型、交叉类型还有元组等类型,如下图。
个人认为类型别名type最大的特点是可以结合typeof使用,如下:
总结
这篇文章主要总结了typescript中类型别名type和接口interface在使用上的一些区别,在类class的类型定义中我们使用接口interface来做,在定义简单类型、联合类型、交叉类型、元组时我们用类型别名type来做,并且它和typeof能够天然的结合在一起使用。在双方都能实现的区域,它们的区别不大。
喜欢我的文章就关注我吧,有问题可以发表评论,我们一起学习,共同成长!
猜你喜欢
- 2024-10-12 php 给app 或前端封装api 接口——json格式
- 2024-10-12 前端基础:vue中Axios的封装和API接口的管理
- 2024-10-12 Vue项目中实现用户登录及token验证
- 2024-10-12 前端开发:TypeScript 接口与泛型 接口使用泛型
- 2024-10-12 Java实战系列-前端VUE代码开发及接口流程设计(1)
- 2024-10-12 你还不了解typescript中接口和类型别名的用法区别?本文帮你总结
- 2024-10-12 前端开发:JavaScript API应用程序编程接口
- 2024-10-12 Java 中间的接口还可以这样用,你知道吗?
- 2024-10-12 Web前端接口画中画(Picture-in-Picture)介绍
- 2024-10-12 vue 项目接口管理 vue3接口
你 发表评论:
欢迎- 05-10如何优化数据库和前端之间的交互?
- 05-10前端代码优化小秘籍(前端优化24条建议)
- 05-10VS Code当中的15个神仙插件,值得收藏
- 05-10如何自己开发一个Google浏览器插件?
- 05-10前端流行框架Vue3教程:14. 组件传递Props效验
- 05-10吃了一年的SU,最好用的插件都在这了
- 05-10前端必看!这款神器让网站界面告别千篇一律
- 05-10程序员请收好:10个非常有用的 Visual Studio Code 插件
- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端md5加密 (49)
- 前端路由 (55)
- 前端数组 (65)
- 前端定时器 (47)
- 前端懒加载 (45)
- 前端接口 (46)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle查询数据库 (45)
- oracle约束 (46)
- oracle 中文 (51)
- oracle链接 (47)
- oracle的函数 (57)
- mac oracle (47)
- 前端调试 (52)
- 前端登录页面 (48)
本文暂时没有评论,来添加一个吧(●'◡'●)