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入门—编写一个简单的JQuery应用案例
Jan 03 Javascript
Js与下拉列表处理问题解决
Feb 13 Javascript
Seajs的学习笔记
Mar 04 Javascript
jQuery实现美观的多级动画效果菜单代码
Sep 06 Javascript
jQuery四种选择器使用及示例
Jun 05 Javascript
原生javascript实现的ajax异步封装功能示例
Nov 03 Javascript
JS如何判断浏览器类型和详细区分IE各版本浏览器
Mar 04 Javascript
关于layui 弹出层一闪而过就消失的解决方法
Sep 09 Javascript
vue项目在webpack2实现移动端字体自适配功能
Jun 02 Javascript
带你彻底理解JavaScript中的原型对象
Apr 14 Javascript
Vue实现下拉加载更多
May 09 Vue.js
Javascript webpack动态import
Apr 19 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写的小东西
2006/12/06 PHP
PHP+ACCESS 文章管理程序代码
2010/06/21 PHP
php检测图片木马多进制编程实践
2013/04/11 PHP
PHP CodeIgniter框架的工作原理研究
2015/03/30 PHP
基于PHP的加载类操作以及其他两种魔术方法的应用实例
2017/08/28 PHP
项目实践之javascript技巧
2007/12/06 Javascript
jQuery Ajax提交表单查询获得数据实例代码
2012/09/19 Javascript
js兼容火狐获取图片宽和高的方法
2015/05/21 Javascript
onclick和onblur冲突问题的快速解决方法
2016/04/28 Javascript
jquery 判断是否支持Placeholder属性的方法
2017/02/07 Javascript
jQuery设置图片等比例缩小的方法
2017/04/29 jQuery
关于vue.js v-bind 的一些理解和思考
2017/06/06 Javascript
VUE中v-model和v-for指令详解
2017/06/23 Javascript
JavaScript内存泄漏的处理方式
2017/11/20 Javascript
nodejs更新package.json中的dependencies依赖到最新版本的方法
2018/10/10 NodeJs
跟老齐学Python之正规地说一句话
2014/09/28 Python
Python 网络爬虫--关于简单的模拟登录实例讲解
2018/06/01 Python
详解Python安装tesserocr遇到的各种问题及解决办法
2019/03/07 Python
django 框架实现的用户注册、登录、退出功能示例
2019/11/28 Python
python和pywin32实现窗口查找、遍历和点击的示例代码
2020/04/01 Python
使用python检查yaml配置文件是否符合要求
2020/04/09 Python
解决在keras中使用model.save()函数保存模型失败的问题
2020/05/21 Python
tensorflow之读取jpg图像长和宽实例
2020/06/18 Python
python基于pygame实现飞机大作战小游戏
2020/11/19 Python
世界上最具创新性的增强型知名运动品牌:Proviz
2018/04/03 全球购物
马来西亚与新加坡长途巴士售票网站:BusOnlineTicket.com
2018/11/05 全球购物
德国家用电器购物网站:Premiumshop24
2019/08/22 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
后勤主管工作职责
2013/12/07 职场文书
办公室前台岗位职责范本
2013/12/10 职场文书
工商管理本科生求职信
2014/07/13 职场文书
县政府领导班子四风问题对照检查材料思想汇报
2014/09/26 职场文书
如何使用Python实现一个简易的ORM模型
2021/05/12 Python
SQL Server数据库基本概念、组成、常用对象与约束
2022/03/20 SQL Server
浅谈为什么我的 z-index 又不生效了
2022/07/15 HTML / CSS
python自动获取微信公众号最新文章的实现代码
2022/07/15 Python