上一篇:第一阶段.模块二:学习笔记-TypeSrcipt的高阶特性一
ts 中的高阶类型(2)
1-this 类型
在类中的方法内,返回this,this就是当前类的实例对象,这样可以实现链式调用
父类
子类
在类中的方法内,返回this,this就是当前类的实力对象,这样可以实现链式调用,子类可以调佣父类的方法
2-索引类型
2-1 索引类型查询操作符-->keyof
keyof 连接的是一个类型,返回一个由这个类型所有属性名组成的联合类型
interface info {
name: string
age: number
}
// 定义变量,变量类型是上面的接口类型
let myest: keyof info //变量类型let myest: "name" | "age"
// 为变量赋值
myest = 'name'
myest = 'age'
myest = 'sex'// 不能将类型“"sex"”分配给类型“"name" | "age"”。
2-2 索引访问操作符--> []
interface info {
name: string
age: number
}
// 定义变量,变量类型是上面的接口类型的name属性对应的类型
let myest: info['name'] // 类型是:let myest: "name"
myest = '1232'
myest = '456'
myest = 16 // 不能将类型“16”分配给类型“string”。
3-映射类型
3-1 基础
借助旧类型创建新类型
ts 内置的映射类型:Partial 是可选类型、Readonly 是只读类型
ts 内置的映射类型:Pick 是返回对象中的一部分数据、Record 是把对象中的每一个值变成其他值
Record 不是同态的, Partial、Readonly、Pick 是同态的
interface Qwd {
age: number
name: string
sex: string
}
// 定义映射类型
type ReadonlyType<T> = {
readonly [P in keyof T]: T[P] // 和for... in 类似 T是数组 P是里面的每一项item
}
// 定义一个新的类型
type ReadonlyTypeInfo1 = ReadonlyType<Qwd>
//ReadonlyTypeInfo1的类型就是:
//type ReadonlyType = {
//readonly age: number;
//readonly name: string;
//readonly sex: string;
//}
// 使用新的类型
let typeInfo11: ReadonlyTypeInfo1 = {
age: 18,
name: '小明',
sex: '男'
// sex:0 // 不能将类型“number”分配给类型“string”
}
// typeInfo11.age = 20 // Cannot assign to 'age' because it is a read-only property.
Pick的实现原理
Readonly的实现原理
Record的实现原理
3-2 由映射类型进行推断
3-3 增加或移出特定修饰符--> + 或者 -
interface TestInterface {
name: string;
age: number;
}
// 增加只读和可选属性
type TestType<T> = {
+readonly [P in keyof T]+?: T[P];
}
type test = TestType<TestInterface>;
//type test = {
// readonly name?: string;
// readonly age?: number;
//}
// 删除只读和可选属性
type UnMyType<T> = {
-readonly [P in keyof T]-?: T[P];
}
type test2 = UnMyType<test>;
//type test2 = {
// name: string;
// age: number;
//}
3-4keyof 和 映射类型在 2.9 的升级
keyof 和 映射类型 是支持number 和symbol命名的属性的
3-5 元组和数组上的映射类型-->生成新的元组和数组
3-6 unknown 3.0新增的
相对于any类型是安全的,可以看成是比较安全的any类型
1、任何类型都可以赋值为unknown类型
let value1:unknown
value1= '111'
value1= 123
2、如果没有类型断言或者基于控制流的类型细化时, unknown 不可以赋值给其他类型,此时它只能 unknown 和 any 类型
let value1:unknown
value1= '111'
value1= 123
let value2:unknown
let value3:string = value2 // 报错:不能将 unknown 类型 赋值给 string类型
value1 = value2 // 是可以的
3、如果没有类型断言或者基于控制流的类型细化时,不能在它上面进行任何的操作
let value1:unknown
value1 +=1 // 报错
4、unkonwn类型与任何其他类型组成的交叉类型,最后都等于其他类型
type type1 = string & unkonwn // type1是string类型
type type1 = number & unkonwn // type1是number类型
type type1 = unkonwn & unkonwn // type1是unkonwn类型
type type1 = string[] & unkonwn // type1是string[]类型
5、unkonwn类型与任何其他类型(除any是any外)组成的联合类型,最后都等于 unknown 类型
type type1 = string | unkonwn // type1是unkonwn类型
type type1 = number | unkonwn // type1是unkonwn类型
type type1 = unkonwn | unkonwn // type1是unkonwn类型
type type1 = string[] | unkonwn // type1是unkonwn类型
type type1 = any | unkonwn // type1是any类型
6、never类型是unknown的子类型
type type1 = never extends unknown ? true :false // true
7、keyof unknown 等于类型never
type type1 = keyof unknown // never
8、只能对 unknown 类型的值 进行等或者不等 操作,不能进行其他操作
type type1 = keyof unknown // never
9、只能对 unknown 类型的值 不能访问它的属性、不能作为函数的调用、不能作为类创建实例
10、使用映射类型时,如果遍历的是unknown类型,则不会映射任何属性
4-条件类型==>2.8新增的
相当于js中的三目运算符/三元表达式
T extends U ? X : Y
4-1 基础
type valueType<T> = T extends string ? string : number
let value:valueType<'123'> // string类型
let value2:valueType<123> // number类型
4-2 分布式条件类型
当待检测的类型是联合类型的时候,该条件类型就是分布式条件类型
4-3 条件类型的类型推断-infer
4-4 TS 预定义条件类型
Exclude<T, U> 返回T类型不在U类型中的类型,是个联合类型
Exclude的实现原理:
type Type1 = Exclude<'a' | 'b' | 'c', 'a'> // 'b' | 'c'的联合类型
Extract<T, U> T类型中可以赋值给U的类型的类型,是个联合类型
Extract的实现原理:
type Type1 = Extract<'a' | 'b' | 'c', 'a' | 'b'> // 'a' | 'b'的联合类型
NonNullable<T> 去掉T类型中的null类型和undefined类型
type Type1 = NonNullable<string | number| null | undefined> // string | number的联合类型
ReturnType<T> 获取函数类型的返回值类型
type Type1 = ReturnType<()=>string> // Type1的类型是string
type Type1 = ReturnType<()=>void> // Type1的类型是void
InstanceType<T> 获取构造函数类型的实例类型