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 相关文章推荐
自制基于jQuery的智能提示插件一枚
Feb 18 Javascript
Prototype的Class.create函数解析
Sep 22 Javascript
浅谈Javascript事件处理程序的几种方式
Jun 27 Javascript
利用jq让你的div居中的好方法分享
Nov 21 Javascript
jquery实现标签上移、下移、置顶
Apr 26 Javascript
javascript类型系统 Array对象学习笔记
Jan 09 Javascript
Angular.Js中ng-include指令的使用与实现
May 07 Javascript
ReactNative短信验证码倒计时控件的实现代码
Jul 20 Javascript
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
Mar 28 jQuery
微信小程序实现随机验证码功能
Dec 20 Javascript
vue实现密码显示与隐藏按钮的自定义组件功能
Apr 23 Javascript
vue实现移动端拖动排序
Aug 21 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 字符串函数收集
2010/03/29 PHP
php设计模式 Command(命令模式)
2011/06/26 PHP
国产PHP开发框架myqee新手快速入门教程
2014/07/14 PHP
Thinkphp 框架扩展之驱动扩展实例分析
2020/04/27 PHP
PHP连接SQL server数据库测试脚本运行实例
2020/08/24 PHP
javascript-TreeView父子联动效果保持节点状态一致
2007/08/12 Javascript
jQuery ui1.7 dialog只能弹出一次问题
2009/08/27 Javascript
JS 事件绑定函数代码
2010/04/28 Javascript
JavaScript中URL编码函数代码
2011/01/11 Javascript
jquery动态加载图片数据练习代码
2011/08/04 Javascript
jQuery中需要注意的细节问题小结
2011/12/06 Javascript
nodejs中的fiber(纤程)库详解
2015/03/24 NodeJs
Bootstrap CSS组件之分页(pagination)和翻页(pager)
2016/12/17 Javascript
快速实现jQuery多级菜单效果
2017/02/01 Javascript
一个Vue视频媒体多段裁剪组件的实现示例
2018/08/09 Javascript
vue图片上传组件使用详解
2019/12/23 Javascript
[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT
2014/05/22 DOTA
Python类定义和类继承详解
2015/05/08 Python
在windows下快速搭建web.py开发框架方法
2016/04/22 Python
Python+tkinter模拟“记住我”自动登录实例代码
2018/01/16 Python
python skimage 连通性区域检测方法
2018/06/21 Python
在python下使用tensorflow判断是否存在文件夹的实例
2019/06/10 Python
python绘制已知点的坐标的直线实例
2019/07/04 Python
python中eval与int的区别浅析
2019/08/11 Python
在python image 中安装中文字体的实现方法
2019/08/22 Python
python3使用GUI统计代码量
2019/09/18 Python
Django-rest-framework中过滤器的定制实例
2020/04/01 Python
20世纪40年代连衣裙和复古服装:The Seamstress Of Bloomsbury
2018/07/24 全球购物
英国邮购活的植物主要供应商:Gardening Direct
2019/01/28 全球购物
武汉英思工程科技有限公司–ORACLE面试测试题目
2012/04/30 面试题
ktv筹备计划书
2014/05/03 职场文书
给学校建议书范文
2014/05/13 职场文书
优秀本科毕业生自荐信
2014/07/04 职场文书
教师党员个人整改措施
2014/10/27 职场文书
乔迁之喜答谢词
2015/01/05 职场文书
利用ajax+php实现商品价格计算
2021/03/31 PHP