交叉类型

交叉类型(&):功能类似于接口继承(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
}

产生报错

typescript 定义json type typescript 定义冲突_typescript

交叉类型
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 添加约束。

  1. 指定更加具体的类型
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 中的一些常见操作
它们都是基于泛型实现的(泛型适用于多种类型,更加通用),并且是内置的,可以直接在代码中使用。
这些工具类型有很多,主要学习以下几个:

  1. Partial
  2. Readonly
  3. Pick<Type, Keys>
  4. Record<Keys, Type>

泛型工具类型 - Partial

泛型工具类型 - Partial 用来构造(创建)一个类型,将 Type 的所有属性设置为可选

interface Props {
    id: string
    children: string[]
}

type PartialProp = Partial<Props>

let pp:PartialProp = {}

typescript 定义json type typescript 定义冲突_泛型_02

泛型工具类型 - Readonly

泛型工具类型 - Readonly 用来构造一个类型,将 Type 的所有属性都设置为 readonly(只读)