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 相关文章推荐
分享27个jQuery 表单插件集合推荐
Apr 25 Javascript
详解Bootstrap glyphicons字体图标
Jan 04 Javascript
老生常谈JavaScript 函数表达式
Sep 01 Javascript
JS基于面向对象实现的拖拽功能示例
Dec 20 Javascript
Angular.JS中指令ng-if、ng-show/ng-hide和ng-switch的使用教程
May 07 Javascript
js+html5生成自动排列对话框实例
Oct 09 Javascript
编写React组件项目实践分析
Mar 04 Javascript
微信小程序实现刷脸登录
May 25 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
Feb 02 Javascript
vue如何截取字符串
May 06 Javascript
vue.js实现只能输入数字的输入框
Oct 19 Javascript
vue实现滚动鼠标滚轮切换页面
Dec 13 Vue.js
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中利用wsdl创建标准webservice的实现代码
2011/12/07 PHP
基于php iconv函数的使用详解
2013/06/09 PHP
php GUID生成函数和类
2014/03/10 PHP
PHP判断是手机端还是PC端 PHP判断是否是微信浏览器
2017/03/15 PHP
PHP正则匹配操作简单示例【preg_match_all应用】
2017/07/10 PHP
PHP children()函数讲解
2019/02/03 PHP
javascript新手语法小结
2008/06/15 Javascript
模拟用户点击弹出新页面不会被浏览器拦截
2014/04/08 Javascript
JS仿Windows开机启动Loading进度条的方法
2015/02/26 Javascript
jQuery垂直多级导航菜单代码分享
2015/08/18 Javascript
jQuery animate easing使用方法图文详解
2016/06/17 Javascript
Javascript中的数组常用方法解析
2016/06/17 Javascript
微信开发 消息推送实现代码
2016/10/21 Javascript
javascript表达式和运算符详解
2017/02/07 Javascript
JS检测是否可以访问公网服务器功能代码
2017/06/19 Javascript
vue-quill-editor富文本编辑器简单使用方法
2018/09/21 Javascript
JavaScript链式调用实例浅析
2018/12/19 Javascript
Vue组件教程之Toast(Vue.extend 方式)详解
2019/01/27 Javascript
微信小程序结合mock.js实现后台模拟及调试
2019/03/28 Javascript
javascript实现遮罩层动态效果实例
2019/05/14 Javascript
vue开发简单上传图片功能
2020/06/30 Javascript
[原创]使用豆瓣提供的国内pypi源
2017/07/02 Python
对python append 与浅拷贝的实例讲解
2018/05/04 Python
django云端留言板实例详解
2019/07/22 Python
Python如何创建装饰器时保留函数元信息
2020/08/07 Python
python opencv实现图像配准与比较
2021/02/09 Python
浅析css3中matrix函数的使用
2016/06/06 HTML / CSS
HTML5页面音视频在微信和app下自动播放的实现方法
2016/10/20 HTML / CSS
欧洲最古老的鞋厂:Peter Kaiser
2019/11/05 全球购物
《我的第一本书》教学反思
2014/02/15 职场文书
真诚的求职信
2014/07/04 职场文书
妈妈活动方案
2014/08/15 职场文书
捐助倡议书
2015/01/19 职场文书
沈阳故宫导游词
2015/01/31 职场文书
2015年母亲节寄语
2015/03/23 职场文书
拿破仑传读书笔记
2015/07/01 职场文书