本书未发布
基本内容
使用情景
在定义函数或类的时候, 如果遇到类型不明确的时候, 可以使用泛型
// T 就是泛型, 他的类型就不确定, 只有在调用的时候, 才能确定 function fn<T>(a: T): T{ return a } // 不指定泛型的时候, 会自动进行推断 fn(10) // 指定泛型 fn<string>('hello') // 泛型可以同时指定多个 function fn1<T, K>(a: T, b: K): T { console.log(b) return a } fn1<number, string>(12, 'hello') let arr: Array<number> = [1, 2, 3]
约束泛型
interface Inter {
length: number
}
// 表示泛型必须是 Inter 的实现类(子类)
function fn2<T extends Inter>(a: T): number{
return a.length
}
// 此时传递的参数就必须就有 length 属性, 例如: 如果传递的参数是一个数字的话, 就会报错
fn2('hello')
泛型的情况
// 泛型的几种情况
function join<T>(first: T, second: T) {
return `${first}${second}`
}
join<string>('a', 'b')
function joinTwo<T, P>(first: T, second: P) {
return `${first}${second}`
}
joinTwo<string, number>('a', 1)
function joinThree<T>(params: Array<T>) {
return params
}
joinThree<string>(['a', 'b'])
function joinFour<T>(a: T, b: T): T {
return a
}
joinFour<string>('a', 'b')
类中使用泛型
class Queue<T> {
private data = []
push(item: T) {
return this.data.push(item)
}
pop(): T {
return this.data.shift()
}
}
const queue = new Queue<number>()
queue.push(1)
const queue1 = new Queue<string>()
queue1.push('string')
接口中使用泛型
interface KeyValue<T, U> {
key: T
value: U
}
let kv1: KeyValue<number, string> = { key: 1, value: 'string' }
let kv2: KeyValue<string, number> = { key: 'string', value: 1 }
// ---
interface Calculate<T> {
(a: T, b: T): T
}
const sum: Calculate<number> = function (a: number, b: number): number {
return a
}
sum(1, 2)
// ---
interface Calculate2 {
<T>(a: T, b: T): T
}
const sum2: Calculate2 = function <T> (a: T, b: T): T {
return a
}
sum2<number>(1, 2)
// ---
interface Calculate3<T> {
<U>(a: T, b: T): U
}
const sum3: Calculate3<number> = function <U> (a: number, b: number): U {
return a as any
}
sum3<number>(1, 2)