【TypeScript】类型兼容性与交叉类型讲解

news2024/11/19 23:28:35

目录

类型兼容性

对象类型兼容性

接口类型兼容性

函数类型兼容性

交叉类型


类型兼容性

在TS中,类型采用的是结构化类型系统,也叫做 duck typing(鸭子类型),类型检查关注的是值所具有的形状。也就是说,在结构化系统中,如果两个对象具有相同形状,则认为他们属于同一类型。

class obj {x: number; y: number}
class obj1 {x: number; y: number}
// 因为TS的结构化类型,只检查obj与obj1的结构是否相同
const p: obj = new obj1()

注意:如果在 Nominal Type System中(比如:C#、java等),它们是不同的类,类型无法兼容。

对象类型兼容性

在结构化系统中,如果两个对象具有相同的形状,则认为他们属于同一类型。这种条件成立的前提在于成员多的可以赋予成员少的,反之则报错。如下:

class obj {x: number; y: number}
class obj1 {x: number; y: number; z: number}

// 成员多的 obj1 可以赋值给成员少的 obj
const p: obj = new obj1()

// const p1: obj1 = new obj() 成员少不能赋值给成员多的,报错

接口类型兼容性

接口类型兼容性,类似于class。并且class和interface之间也可以兼容。

interface person {
  name: string
  age: number
}
interface person1 {
  name: string
  age: number
}
interface person2 {
  name: string
  age: number
  say: ()=> void
}
let p1: person = {name:'张三',age:18}
let p2: person1 = {name:'李四',age:17}
let p3: person2 = {name:'王五',age:16,say(){}}
p2=p1
p1=p2
// p3=p1 报错

// 类和接口之间也可以兼容
class person3 {
  name: string
  age: number
  say: ()=> void
}
let p4: person3 = {name:'陈六',age:15,say(){}}
p2=p4

函数类型兼容性

函数类型的兼容性比较复杂,需要考虑以下三种情况:

参数个数:参数多的兼容参数少的,即参数少的可以赋值给参数多的。

type F1 = (a: number) => void
type F2 = (a: number,b: number) => void
let f1: F1 = (a=1)=>{}
let f2: F2
f2=f1
// f1=f2 参数多的不能赋值给参数少的 报错

参数类型:相同位置的参数类型要相同(原始类型)或兼容(对象类型)。

type F1 = (a: number) => void
type F2 = (a: number) => void
let f1: F1 = ()=>{}
let f2: F2 = ()=>{}
f1 = f2

在对象类型中,参数可能很多,这个时候就需要参数多的兼容参数少的,即参数少的能赋值给参数多的,如下:

interface point1 {
  name:string
  age:number
}
interface point2 {
  name:string
  age:number
  say():void
}
type F1 = (P:point1) => void // 相当于两个参数
type F2 = (P:point2) => void // 相当于三个参数

let f1:F1=()=>{}
let f2:F2
f2=f1

返回值类型:只关注返回值类型本身即可。如果返回值类型是原始类型,类型之间要相同;如果返回值类型是对象类型,成员多的可以赋值给成员少的。

// 原始类型
type F1 = ()=> string
type F2 = ()=> string
let f1: F1 = ()=>{return '1'}
let f2: F2 = f1

// 对象类型
type F3 = {name:string}
type F4 = {name:string,age:number}
let f3: F3
let f4: F4 = {name:'张三',age:18}
f3=f4

交叉类型

交叉类型(&):功能类似于接口继承(extends),用于组合多个类型为一个类型(常用于对象类型),使用教程类型后,新的类型就具备被交叉的类型的所有属性类型。如下:

interface Cat {
  name:string
}
interface Dog {
  say():void
}
// Animals属性同时具备 接口 Cat和Dog 的所有属性
type Animals = Cat & Dog
let p: Animals = {
  name:'毛',
  say(){
    console.log('汪汪');
  }
}

交叉类型(&)与 接口继承(extends)的对比:

相同点:都可以实现对象类型的组合。

不同点:两种方式实现类型组合时,对于同名属性之间,处理类型冲突的方式不同。

当不同的接口类型出现同名属性不兼容的时候,接口继承处理的方法是报错

 interface Cat {
  fn:(value:number)=>string
 }
 interface Dog extends Cat {
  fn:(value:string)=>string
 }

当不同的接口类型出现同名属性不兼容的时候,交叉类型处理的方法是处理成联合类型

interface Cat {
fn:(value:number)=>string
}
interface Dog {
fn:(value:string)=>string
}
type Animals = Cat & Dog
// 交叉类型将fn的参数值类型变为联合类型  fn:(value:number|string) => string
// ! 作用强调这个值不为空
let p!: Animals
// 没有报错
p.fn(1) 
p.fn('2')

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/112319.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

C. Building a Fence(范围判定)

Problem - 1469C - Codeforces 你想建造一个由n个相等部分组成的栅栏。所有部分的宽度都等于1,高度都等于k。 不幸的是,篱笆下面的地面并不平坦。为了简单起见,你可以认为第i节下面的地面等于hi。 你应该遵循几个规则来建造围栏。 连续的部…

C++知识总结

1.C面向对象三大特征:继承、封装、多态。其中多态分为静态多态和动态多态。静态多态:重载,参数模板 动态多态:虚函数,强制转换。 2.static类型的变量存在静态存储区,初始值为0或者null 3.char *p“PCGAME”…

kubekey初期尝试安装 KubeSphere单机和多机避坑指南

kubekey初期尝试安装 KubeSphere单机和多机避坑指南 准备工作 请注意开始前工作确定各个软件版本情况,本文章要想阅读比较舒服请还得有些Go开发经验 CentOS 7.9 KubeKey v1.21 KubeSphere v3.2.1 Docker 和 Kubernetes 根据支持进行选择: 获取支持可以通…

【复盘】2022年度复盘

年度总结 今年的年度总结比之前写早了一点,主要在因为居家办公时间太久,正好有空就找点时间提前写一下总结复盘计划,说实话要是每月都写一次,我自己也做不到。今年这一年如果用两个字来形容的话,应该是坚定 工作篇 …

用树莓派4B安装gitlab,亲测可用~

最近成功在CentOS7上安装了gitlab,忽然想到是不是可以把吃灰的树莓派4B也装上gitlab,于是研究了一下,做个分享。 树莓派是4B 8G版本。本身装的是官方的64位系统。之前可能还装过一些乱七八糟的东西,这里就不提了。 上gitlab官网…

m基于GRNN广义回归神经网络的飞机发动机剩余寿命预测matlab仿真,训练集采用C-MAPSS数据集

目录 1.算法描述 2.仿真效果预览 3.MATLAB核心程序 4.完整MATLAB 1.算法描述 GRNN建立在非参数核回归基础上,以样本数据为后验条件,通过执行诸如Parzen非参数估计,从观测样本里求得自变量和因变量之间的联结概率密度函数之后,…

mysql查询某字符串是否在某字段中精确查找是否存在和case when语法规则使用说明

mysql中函数find_in_set可以对字符串在某个字段中是否存在,如果存在则返回含有该查询项的所有记录 SELECT count(1) FROM contingency_plan_team_role WHERE find_in_set( 36, preview_task_ids); 查询结果: case when 进行分组判断 cas…

【数据结构与算法基础】青岛大学王卓老师

【数据结构与算法基础】 1. 学习笔记参考 《数据结构与算法基础》教学视频目录87师兄-B站课程《数据结构与算法基础》脑图 2. 学习章节 【青岛大学王卓】第1章_前言【青岛大学王卓】第2章_线性表【青岛大学王卓】第3章_栈和队列【青岛大学王卓】第4章_串、数组和广义表【青岛…

Python爬虫入门——BeautifulSoup库

一、前言 这篇来演示如何使用BeautifulSoup模块来从HTML文本中提取我们想要的数据。 update on 2016-12-28:之前忘记给BeautifulSoup的官网了,今天补上,顺便再补点BeautifulSoup的用法。 update on 2017-08-16:很多网友留言说U…

搜索(5):迭代加深、双向dfs

活动 - AcWing 算法竞赛进阶指南 一、迭代加深概述 dfs每次选定一个分支,直到抵达递归边界才回溯,这种策略有一定缺陷。当搜索树的某个分支情况非常多,并且问题的答案在一个较浅的分支上时,如果一开始就选错了分支&#xff0…

在宜宾,看见未来中国的产融平台样本

在被验证的京东西南数字化产融协同平台背后,恰证明着在京东这样的新型实体企业支持下,中国的区域产业经济已经出现星星之火,而这些星星之火正在帮助成千上万的企业走出固有的销售渠道和销售模型,成为新时代数字经济和产业经济的一…

单芯片快速以太网MAC控制器DM9000介绍

DM9000简介 DM9000是一款完全集成的和符合成本效益单芯片快速以太网MAC控制器与一般处理接口,一个10/100M 自适应的PHY 和4K DWORD 值的SRAM。它的目的是在低功耗和高性能进程的3.3V与5V的支持宽容。 DM9000 还提供了介质无关的接口,来连接所有提供支持介…

javaee之spring2

基于注解的IOC配置 一、先来说一下放在对象上面的注解 Component: * 作用:用于把当前类对象存入spring容器中 * 属性: * value:用于指定bean的id。当我们不写时,它的默认值是当前类名&#xf…

RabbitMQ 第一天 基础 5 Spring 整合RabbitMQ 5.2 Spring 整合 RabbitMQ【消费者】 5.3 小结

RabbitMQ 【黑马程序员RabbitMQ全套教程,rabbitmq消息中间件到实战】 文章目录RabbitMQ第一天 基础5 Spring 整合RabbitMQ5.2 Spring 整合 RabbitMQ【消费者】5.2.1 消费者5.3 小结第一天 基础 5 Spring 整合RabbitMQ 5.2 Spring 整合 RabbitMQ【消费者】 5.2.1…

白话说Java虚拟机原理系列【第五章】:内存结构之堆详解

文章目录堆(Heap)对象在堆中的存储结构垃圾收集器详解对象存活判断算法引用的种类对象最终判定死亡之两次标记规则方法区的垃圾回收原则垃圾收集算法分代收集模型垃圾收集器对象分配原则垃圾收集触发方式垃圾收集器的参数异常前导说明: 本文基于《深入理解Java虚拟机…

大数据分析案例-基于逻辑回归算法构建垃圾邮件分类器模型

🤵‍♂️ 个人主页:艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞&#x1f4…

【Django】第二课 基于Django超市订单管理系统开发

概念 本文在上一文之上,针对管理员,经理,普通员工身份的用户操作用户管理模块功能。 功能实现 1.普通员工登录系统后,对于用户管理模块不具备操作其他用户信息的权限。因此当普通员工登录后,弹出对话框提示用户。 2…

【Linux】Linux编辑器---vim的使用

等老了就养只柴犬,相依为命。 文章目录一、命令模式1.光标定位操作2.文本复制、粘贴、剪切、撤销3.文本编辑二、插入模式三、底行模式四、vim配置原理五、解决普通用户无法使用sudo提权一、命令模式 刚打开vim时,默认就是命令模式,命令模式的…

C++STL之string的使用

对于C语言中的字符串,我们只能使用char类型数组保存,并且是以\0结尾的. 操作起来非常不方便而且底层空间需要用户自己访问,非常造成容易越界访问. 这个时候,C的STL中的string类就很好解决了这些. 目录 string的使用 1.string…

mqtt的使用与二次封装

前提:先安装Mosquitto并启动服务,可使用mqttx进行接收发送的测试。 Mosquitto以配置启动命令 mosquitto -c mosquitto.conf -v原文链接:mqtt的使用 本文为测试使用固无账号密码,可在原文查看 封装后实现效果,加入一个…