TS 类型兼容教程示例详解


Posted in Javascript onSeptember 23, 2022

类型兼容

因为JS语言不慎过于领过, 真实开发场景中往往无法做到严格一致的类型约束,此时TS就不得不做类型兼容

  • 顶类型:unknown -- 任何类型都可以赋值给unknown
  • 底类型:never -- never兼容任何类型(可以赋值给任何类型)
  • any: 其实不是一个类型,它是一个错误关闭器,用了any就等同于放弃了类型约束

TS 类型兼容教程示例详解

TS 类型兼容教程示例详解

简单类型兼容

子集可以赋值给父级

type name = string | number

stringnumber 都是 类型name 的子集

普通对象兼容

属性多的可以赋值给属性少的,前提是有共同属性

  • 属性越多,限制越多,表示的集合越小(符合条件的对象越少)
  • 属性越少,限制越少,表示的集合越大
type Person = {
  name: string
  age: number
}
let user = {
  name: 'liu',
  age: 20,
  email: ''
}
let p: Person = user

函数兼容

参数数量不一致

数量少的兼容数量多的,前提为类型一致

TS 类型兼容教程示例详解

只要参数部分能够找到对应的位置就用**==绿色箭头==,否则为==红色箭头==**,当参数全为绿色箭头时,最左侧的箭头就为绿色,代表函数可以兼容

参数类型不一致

参数部分: 子类可以兼容父类,则函数整体不能兼容,

MyMouseEventMyEvent 的子类,所以mouseListener 不兼容 listener

==对参数要求多的函数不能赋值给对参数要求少的函数==

MyEventMyMouseEvent 的父类,所以listener 兼容 mouseListener

TS 类型兼容教程示例详解

返回不同

返回值属性多集合小 可以 兼容 返回值属性少集合大

TS 类型兼容教程示例详解

以上就是TS 类型兼容教程示例详解的详细内容,更多关于TS 类型兼容的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
bcastr2.0 通用的图片浏览器
Nov 22 Javascript
JavaScript中使用replace结合正则实现replaceAll的效果
Jun 04 Javascript
快速解决jquery之get缓存问题的最简单方法介绍
Dec 19 Javascript
jQuery对下拉框,单选框,多选框的操作
Feb 21 Javascript
jQuery .tmpl() 用法示例介绍
Aug 21 Javascript
Bootstrap基础学习
Jun 16 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
May 05 Javascript
JS简单获得节点元素的方法示例
Feb 10 Javascript
8 个有用的JS技巧(推荐)
Jul 03 Javascript
vue 实现移动端键盘搜索事件监听
Nov 06 Javascript
js与jquery获取input输入框中的值实例讲解
Feb 27 jQuery
解决vue数据不实时更新的问题(数据更改了,但数据不实时更新)
Oct 27 Javascript
TS 类型收窄教程示例详解
Sep 23 #Javascript
JavaScript实现简单的音乐播放器
Aug 14 #Javascript
vue实现简易音乐播放器
Aug 14 #Vue.js
Vue3实现简易音乐播放器组件
Aug 14 #Vue.js
element tree树形组件回显数据问题解决
Aug 14 #Javascript
el-table-column 内容不自动换行的解决方法
Aug 14 #Vue.js
JavaScript实现音乐播放器
You might like
用php写的serv-u的web申请账号的程序
2006/10/09 PHP
thinkphp微信开发(消息加密解密)
2015/12/02 PHP
PHP获取当前执行php文件名的代码
2017/03/02 PHP
ThinkPHP框架获取最后一次执行SQL语句及变量调试简单操作示例
2018/06/13 PHP
PHP代码覆盖率统计详解
2020/07/22 PHP
利用JQuery为搜索栏增加tag提示
2009/06/22 Javascript
JS 巧妙获取剪贴板数据 Excel数据的粘贴
2009/07/09 Javascript
jQuery学习笔记之控制页面实现代码
2012/02/27 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
好好了解一下Cookie(强烈推荐)
2016/06/14 Javascript
vuejs通过filterBy、orderBy实现搜索筛选、降序排序数据
2020/10/26 Javascript
JS闭包用法实例分析
2017/03/27 Javascript
Angular.js自动化测试之protractor详解
2017/07/07 Javascript
理顺8个版本vue的区别(小结)
2018/09/17 Javascript
jQuery实现的简单歌词滚动功能示例
2019/01/07 jQuery
jQuery实现ajax的嵌套请求案例分析
2019/02/16 jQuery
layui使用form表单实现post请求页面跳转的方法
2019/09/14 Javascript
Layui tree 下拉菜单树的实例代码
2019/09/21 Javascript
Vue打包后访问静态资源路径问题
2019/11/08 Javascript
JavaScript点击按钮生成4位随机验证码
2021/01/28 Javascript
Django1.7+python 2.78+pycharm配置mysql数据库教程
2014/11/18 Python
Python的Flask框架中集成CKeditor富文本编辑器的教程
2016/06/13 Python
Python3 pip3 list 出现 DEPRECATION 警告的解决方法
2019/02/16 Python
python实现图像外边界跟踪操作
2020/07/13 Python
详解python 内存优化
2020/08/17 Python
python利用递归方法实现求集合的幂集
2020/09/07 Python
天猫国际进口超市直营:官方直采,一站购齐
2017/12/11 全球购物
荷兰牛仔裤网上商店:Jeans Centre
2018/04/03 全球购物
系统管理员的职责包括那些?管理的对象是什么?
2016/09/20 面试题
培训讲师邀请函
2014/01/10 职场文书
义和团口号
2014/06/17 职场文书
高二学年自我鉴定范文(2篇)
2014/09/26 职场文书
经验交流材料格式
2014/12/30 职场文书
军训个人总结
2015/03/03 职场文书
物业管理交接协议书
2016/03/24 职场文书
Android 界面一键变灰 深色主题工具类
2022/04/28 Java/Android