网站留言发送到qq邮箱,大数据适合什么人学,工作室 网站备案,制作营销网站什么是TypeScript 泛型#xff1f;
在定义函数#xff0c;接口#xff0c;类的时候不能预先确定使用的数据类型#xff0c;而是在调用使用这些函数#xff0c;接口#xff0c;类的时候才能确定的数据类型#xff1b;
1#xff0c;单个泛型的参数
例如通过使用any这种…什么是TypeScript 泛型
在定义函数接口类的时候不能预先确定使用的数据类型而是在调用使用这些函数接口类的时候才能确定的数据类型
1单个泛型的参数
例如通过使用any这种方式value1的类型随着传入的类型数据而变化
function myfunction01(value1: any, value2: number): any[]{let arr: any[] [value1, value2]return arr
}
myfunction01(123456, 111);
myfunction01(123456, 111);改为泛型之后
function myfunction01T(value1: T, value2: T): T[]{// let arr: T[] [value1, value2]let arr: ArrayT [value1, value2]return arr
}
myfunction01string(123456, 1111);
myfunction01number(123456, 111);2多个泛型的参数
function myfunction01T, X(value1: T, value2: X): [T, X]{return [value1, value2]
}
myfunction01string, number(123456, 1111);3泛型接口
泛型接口接口也可以配合泛型来使用以增加其灵活性增强其复用性
interface 接口名类型变量1,类型变量2 {变量:类型变量1,变量:类型变量2
}使用
interface MyArrayT {length: T,data:string[]push(n: T): T,pop(): void,reverse(): T[]
}
const obj: MyArraynumber {length: 11,push (o){ return o },pop: function () {},reverse: () [1, 2],data: [1, 1]
}在接口名称的后面添加 类型变量那么这个接口就变成了泛型接口。接口的类型变量对接口中所有其他成员可见也就是接口中所有成员都可以使用类型变量。使用泛型接口时需要显式指定具体的类型。
4泛型工具类型
泛型工具类型:TS 内置了一些常用的工具类型来简化 TS 中的一些常见操作
说明:它们都是基于泛型实现的(泛型适用于多种类型更加通用)并且是内置的可以直接在代码中使用。 这些工具类型有很多先来学习以下3个:
① Partial
将一个对象类型中的所有属性变为可选属性
type User {id: number;name: string;age: number;
}
type UpdatedPerson PartialUser;得到的 UpdatedPerson 类型与下面的类型定义是相同的
type UpdatedPerson {id?: number;name?: string;age?: number;
}② Readonly
将Type 所有属性都设置为 readonly(只读)。
type Props {id: stringchildren: number[]
}
type ReadonlyProps ReadonlyProps构造出来的新类型 ReadonlyProps 结构和 Props 相同但所有属性都变为只读的。不可修改
③ Pick
PickType, Keys 从 Type 中选择一组属性来构造新类型。
type Props {id: stringtitle: stringchildren: number[]
}
type PickProps PickProps, id | titlePick 工具类型有两个类型参数:1 表示选择谁的属性 2 表示选择哪几个属性。 2. 其中第二个类型变量如果只选择一个则只传入该属性名即可。第二个类型变量传入的属性只能是第一个类型变量中存在的属性。构造出来的新类型 PickProps只有 id 和 title 两个属性类型。
