【typescript】Typescript联合类型 类型断言 、Typescript 泛型函数以及使用场景

一.Typescript联合类型 类型断言

interface myinterface {
    name: string
    ren(): void
}

interface youinterface {
    name: string,
    hobby(): void
}


function getname(event: myinterface | youinterface) {
    // return event.ren()  //报错
    return (event as youinterface).hobby()
}

getname({ name: '斗罗大陆', ren() { console.log('唐三'); } })
getname({ name: '星辰变', hobby() { console.log(`飞行`); } })

上述说明:

return event.ren()  会报错 是因为 形参使用了 联合类型传入了两个类型 ， 报错是因为他也不知道你要使用 这两个类型中的那一个 

这种情况下就可以使用 as 具体类型 ， 来使用了

描述:

1. 使用 as 实现类型断言

2. as 后面的类型是一个更加具体的类型 

注意:当ts 不确定联合类型的变量到底是哪个类型的时候 采用类型断言 as 将其指定为一个类型

二.Typescript 泛型函数

function numtion<T>( value: T ) { return: value }

描述：

1.在函数名称的后面添加 <> 尖括号 ， 尖括号内添加自定义类型变量名称

2. 类型变量 是一种特殊的变量 他处理类型而不是值

3.类型变量相当于一个类型容器 能够捕获到用户提供的类型

4.因为T是类型 然后可以将 他作为函数参数和返回值的类型 表示参数和返回值具有相同的类型

5.类型变量 可以是任意合法名称

使用场景

问题: 

function numtion(event: number) {
    return event
}
numtion(1)

function nantion(event: string) {
    return event
}
nantion('1')

function leantion(event: boolean) {
    return event
}
leantion(true)

描述: 我这里要创建 number string boolean 类型函数 ， 我这样创建需要创建三个函数并指定对应的类型 ， 这样写太占有资源

解决问题:

function grouption<T>(event: T):T {
    return console.log(event);
}
grouption(1)
grouption('1')
grouption(true)

解决方法是 使用泛型函数 ，他就相当于一个类型容器 能够捕获用户提供的类型 

当传入 number 后 这个类型就被函数声明时指定的变量 T 捕获到 ，此时 T 类型就是 number，同样传入 string 类型，函数 grouption 参数和返回值的类型都是 string

通过泛型可以让 grouption 函数与多种不同的类型一起工作 实现了复用的同时保证了类型的安全