交叉类型
交叉类型(&):功能类似于接口继承(extends),用于组合多个类型为一个类型(常用于对象类型)
interface Person2 {name: string}
interface Contact {phone: number}
type PersonDetail = Person2 & Contact
let Obj: PersonDetail = {
name: 'Anas',
phone: 1111
}
交叉类型(&)和接口继承(extends)的对比:
相同点:都可以实现对象类型的组合。
不同点:两种方式实现类型组合时,对于同名属性之间,处理类型冲突的方式不同。
接口类型
interface A {
fn: (value: number) => void
}
interface B extends A {
fn: (value: string) => void
}
产生报错
交叉类型
interface A {
fn: (value: number) => void
}
interface B {
fn: (value: string) => void
}
type C = A & B
let c: C = {fn(value: number| string){}}
c.fn()
泛型
泛型是可以在保证类型安全前提下,让函数等与多种类型一起工作,从而实现复用,常用于:函数、接口、class 中。
需求:创建一个 id 函数,传入什么数据就返回该数据本身(也就是说,参数和返回值类型相同)
function id<Type>(value: Type): Type {
return value
}
const num = id<number>(10)
简单调用泛型函数
const str = id('a')
添加泛型约束收缩类型,主要有以下两种方式:1 指定更加具体的类型 2 添加约束。
- 指定更加具体的类型
function id<Type>(value: Type[]): Type[] {
console.log(value.length)
return value
}
2 添加约束
interface ILENGTH {length: number}
function id<Type extends ILENGTH> (value: Type): Type {
console.log(value.length)
return value
}
const num3 = id<string>('100')
多个泛型变量
泛型的类型变量可以有多个,并且类型变量之间还可以约束(比如,第二个类型变量受第一个类型变量约束)
比如,创建一个函数来获取对象中属性的值:
function getProp<Type, Key extends keyof Type>(obj: Type, key: Key) {
console.log(obj[key])
return obj[key]
}
let person = {name: 'Anas', age: 18}
getProp(person, 'name') //正常运行
getProp(person, 'name1') //报错
泛型接口
泛型接口:接口也可以配合泛型来使用,以增加其灵活性,增强其复用性
interface IdFunc<Type> {
id: (value: Type) => Type
ids: () => Type[]
}
let obj6: IdFunc<number> = {
id(value) {return value},
ids() {return [1, 2, 3]}
}
泛型类
class GenericNumber<NumType> {
defaultValue: NumType
add: (x: NumType, y: NumType) => {}
constructor(value: NumType) {
this.defaultValue = value
}
}
const myNum = new GenericNumber<number>(100)
myNum.defaultValue = 10
myNum.add('a', 'b') //报错
泛型工具类型
泛型工具类型:TS 内置了一些常用的工具类型,来简化 TS 中的一些常见操作
它们都是基于泛型实现的(泛型适用于多种类型,更加通用),并且是内置的,可以直接在代码中使用。
这些工具类型有很多,主要学习以下几个:
- Partial
- Readonly
- Pick<Type, Keys>
- Record<Keys, Type>
泛型工具类型 - Partial
泛型工具类型 - Partial 用来构造(创建)一个类型,将 Type 的所有属性设置为可选
interface Props {
id: string
children: string[]
}
type PartialProp = Partial<Props>
let pp:PartialProp = {}
泛型工具类型 - Readonly
泛型工具类型 - Readonly 用来构造一个类型,将 Type 的所有属性都设置为 readonly(只读)