>[success] # 联合类型
~~~
1.联合类型表示一个值可以是几种类型之一,用'|' 来表示
~~~
~~~
const getLenFunc = (content:number|string)=>{
if (typeof content === 'string'){ return content.length}
else {return content.toString().length}
}
// getLenFunc(true) // 报错 只能是string 或者是number类型中的一个
~~~
>[danger] ##### 没有联合类型
~~~
1.如果没有联合类型可能使用时候需要'any' 或'unknown'
~~~
~~~
// 只想让参数接受 string 和 number 参数,需要不停的缩小参数范围
function getParams(param: unknown) {
if (typeof param === 'string') return param
else if (typeof param === 'number') return param
else throw Error('只能是字符类型')
}
~~~
![](https://img.kancloud.cn/42/f2/42f2fe084b5098546cce38a280c3cb7e_686x161.png)
* 用联合类型
~~~
function getParams1(param: string | number) {
return param
}
~~~
![](https://img.kancloud.cn/dd/69/dd6929731ffafa639d9f0acd3fc38df5_766x120.png)
>[danger] ##### 接口用联合类型
~~~
1.如果一个值是联合类型,我们只能访问此联合类型的所有类型里共有的成员
简单的说'使用一个联合类型的参数只能使用共有成员',下面案例中c虽然有age属性,但是会报错
只能使用他们的共有成员name
~~~
~~~
interface a {
name:string,
age:number
}
interface b {
name:string,
sex:string
}
// const c:(a|b) = {
// age:13,
// sex:'nan'
// } // 报错
const c:(a|b) = {
name:'fff',
age:12,
sex:'w'
}
// c.age// 报错
c.name
~~~
>[danger] ##### 可辨识联合类型
~~~
1.在中增加 和 修改 这两个需求的时候往往,新增不需要id 但是修改需要id,往往这种处理一般都会集中在一个公共方法中
举个例子
~~~
~~~
type Add = {
name: string
age: number
}
type Edit = {
id: number
name: string
age: number
}
function submit(params: Add | Edit) {
// .......
console.log(params.id) // 报错
}
~~~
* 解决方法缩小范围
~~~
1.使用 if 等流程控制语句,下面案例只能使用'in'
~~~
~~~
type Add = {
name: string
age: number
}
type Edit = {
id: number
name: string
age: number
}
function submit(params: Add | Edit) {
// 无效
// if(params.id){ //
// console.log(params.id)
// }
// 无效
// if(Reflect.has(params,"id")){
// console.log(params.id)
// }
// 无效
// if(Reflect.get(params,"id")){
// console.log(params.id)
// }
if ('id' in params) {
console.log(params.id)
}
}
~~~
- TypeSprict -- 了解
- TS-- 搭建(一)webpack版本
- TS -- 搭建(二)直接使用
- TS -- 基本类型
- ts -- 类型推导和字面量类型
- ts -- 类型扩展和类型缩小
- ts -- any场景
- ts -- 使用unknown 还是 any
- ts -- any/never/unknown
- ts -- 断言
- ts -- 类型大小写疑惑
- ts -- 数组类型 [] 还是泛型疑惑
- TS -- 枚举
- 外部枚举
- TS -- 函数
- ts -- 重载作用
- ts -- 05 this is
- 解构
- TS -- 接口
- 绕过接口的多余参数检查
- Interface 与 Type 的区别
- TS -- 类
- ts -- 类作为类型
- TS -- 交叉和联合 类型
- ts -- 交叉类型
- ts -- 联合类型
- ts -- 交叉和联合优先级
- ts -- 类型缩减
- TS -- 什么是泛型
- ts -- 泛型函数表达式/函数别名/接口
- ts -- 泛型类
- ts -- extends 泛型约束
- ts -- 泛型new
- ts -- Ts的泛型
- TS -- 缩小类型详解类型守卫
- TS -- 类型兼容性
- TS -- 命名空间与模块化
- ts -- 模块化
- ts -- 命名空间
- TS -- 工具方法
- Record -- 一组属性 K(类型 T)
- Exclude -- 从联合类型中去除指定的类
- Extract -- 联合类型交集
- NonNullable -- 从联合类型中去除 null 或者 undefined
- Partial -- 将所有属性变为可选
- Required -- 所有属性变为必填
- Readonly -- 所有属性只读
- Pick -- 类型中选取出指定的键值
- Omit -- 去除指定的键值