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 相关文章推荐
JavaScript触发器详解
Mar 10 Javascript
如何将JS的变量值传递给ASP变量
Dec 10 Javascript
Jquery+CSS3实现一款简洁大气带滑动效果的弹出层
May 15 Javascript
可简单避免的三个JS发布错误的详细介绍
Aug 02 Javascript
可恶的ie8提示缺少id未定义
Mar 20 Javascript
JS获取浏览器语言动态加载JS文件示例代码
Oct 31 Javascript
javascript正则表达式之search()用法实例
Jan 19 Javascript
基于BootStrap栅格栏系统完成网站底部版权信息区
Dec 23 Javascript
jQuery 判断元素整理汇总
Feb 28 Javascript
Vue中封装input组件的实例详解
Oct 17 Javascript
浅谈angularJS2中的界面跳转方法
Aug 31 Javascript
小程序实现密码输入框
Nov 16 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+MYSQL会员系统的登陆即权限判断实现代码
2011/09/23 PHP
php面向对象之反射功能与用法分析
2017/03/29 PHP
PHP封装的mysqli数据库操作类示例
2019/02/16 PHP
JS中如何设置readOnly的值
2013/12/25 Javascript
js中把JSON字符串转换成JSON对象最好的方法
2014/03/21 Javascript
JavaScript异步加载浅析
2014/12/28 Javascript
js实现点击链接后窗口缩小并居中的方法
2015/03/02 Javascript
js使用onmousemove和onmouseout获取鼠标坐标的方法
2015/03/31 Javascript
jQuery插件bxSlider实现响应式焦点图
2015/04/12 Javascript
javascript连续赋值问题
2015/07/08 Javascript
js console.log打印对像与数组用法详解
2016/01/21 Javascript
详解AngularJs中$resource和restfu服务端数据交互
2016/09/21 Javascript
ES6中Proxy与Reflect实现重载(overload)的方法
2017/03/30 Javascript
Angular2生命周期钩子函数的详细介绍
2017/07/10 Javascript
详解适配器在JavaScript中的体现
2018/09/28 Javascript
详解一个基于react+webpack的多页面应用配置
2019/01/21 Javascript
jquery+php后台实现省市区联动功能示例
2019/05/23 jQuery
微信小程序3D轮播实现代码
2019/09/19 Javascript
js实现百度淘宝搜索功能
2020/02/17 Javascript
解决Vue 移动端点击出现300毫秒延迟的问题
2020/07/21 Javascript
[48:30]LGD vs infamous Supermajor小组赛D组 BO3 第一场 6.3
2018/06/04 DOTA
Python常见数据结构详解
2014/07/24 Python
批量将ppt转换为pdf的Python代码 只要27行!
2018/02/26 Python
python对矩阵进行转置的2种处理方法
2019/07/17 Python
Python中bisect的使用方法
2019/12/31 Python
Django 解决阿里云部署同步数据库报错的问题
2020/05/14 Python
QML实现钟表效果
2020/06/02 Python
Python基于smtplib协议实现发送邮件
2020/06/03 Python
CSS3实现伪类hover离开时平滑过渡效果示例
2017/08/10 HTML / CSS
注塑工厂厂长岗位职责
2013/12/02 职场文书
货车司机岗位职责
2014/03/18 职场文书
反四风对照检查材料
2014/09/22 职场文书
关于有小孩的离婚协议书
2014/10/26 职场文书
2015年个人实习工作总结
2014/12/12 职场文书
六一儿童节新闻稿
2015/07/17 职场文书
redis实现排行榜功能
2021/05/24 Redis