>[success] # extends 泛型约束
~~~
1.泛型现在似乎可以是任何类型,但实际开发可能往往不是任意类型,需要给以一个范围,这种就叫'泛型约束'关键字('extends')
泛型是具有当前指定的属性写法上'<T extends xx>'
2.注意泛型约束是约束泛型的 在<> 这里写
~~~
>[danger] ##### 泛型约束
~~~
1.限定了泛型入参只能是 number | string | boolean 的子集
~~~
~~~
function reflectSpecified<P extends number | string | boolean>(param: P):P {
return param;
}
reflectSpecified('string'); // ok
reflectSpecified(1); // ok
reflectSpecified(true); // ok
reflectSpecified(null); // ts(2345) 'null' 不能赋予类型 'number | string | boolean'
~~~
~~~
interface ReduxModelSpecified<State extends { id: number; name: string }> {
state: State
}
type ComputedReduxModel1 = ReduxModelSpecified<{ id: number; name: string; }>; // ok
type ComputedReduxModel2 = ReduxModelSpecified<{ id: number; name: string; age: number; }>; // ok
type ComputedReduxModel3 = ReduxModelSpecified<{ id: string; name: number; }>; // ts(2344)
type ComputedReduxModel4 = ReduxModelSpecified<{ id: number;}>; // ts(2344)
~~~
>[danger] ##### 泛型约束结合索引类型的使用
~~~
1.看下面案例想 获取对象value 输出出来
type Info = {
name:string
age:number
}
function getVal(obj:Info, key:any) {
return obj[key] // 报错
}
~~~
![](https://img.kancloud.cn/25/99/2599f2ee01c774e5002910a712b04141_954x235.png)
* 正确写法可以利用keyof 吧传入的对象的属性类型取出生成一个联合类型
~~~
type Info = {
name:string
age:number
}
function getVal(obj:Info, key:keyof Info) {
return obj[key]
}
~~~
* 使用泛型
~~~
1.利用'索引类型 keyof T 把传入的对象的属性类型取出生成一个联合类型',再用'extends 做约束'
~~~
~~~
// 注意泛型约束是约束泛型的 在<> 这里写
type GetVal = <T extends object, K extends keyof T>(obj: T, key: K) => string
function getVal(obj: any, key: any): GetVal {
return obj[key]
}
getVal({ name: 'w' }, 'name')
~~~
>[danger] ##### 多重约束
~~~
interface FirstInterface {
doSomething(): number
}
interface SecondInterface {
doSomethingElse(): string
}
// // interface ChildInterface extends FirstInterface, SecondInterface {}
二者等同
class Demo<T extends FirstInterface & SecondInterface> {
private genericProperty: T
useT() {
this.genericProperty.doSomething() // ok
this.genericProperty.doSomethingElse() // ok
}
}
~~~
- 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 -- 去除指定的键值