TypeScript学习日记-泛型

147 阅读1分钟

用于解决类,接口,方法的复用性,以及对不特定的数据类型的支持

泛型函数

// 只能返回string
function getData(value: string): string {
    return value;
}

// 返回string和number
// 使用any等于放弃类型检查, 当需要传入为string,返回string, 传入number,返回number时,则不支持
// 泛型,支持不特定数据类型
function getData<T>(value: T): T {
    return value;
}
getData<number>(123)
getData<string>('123')

泛型类

class TCalss<T>{
    public list: T[] = [];
    add(value: T): void {
        this.list.push(value)
    }
    first(): T {
        return this.list[0]
    }
}

var n = new TCalss<number>();
var s = new TCalss<string>();

对于一些数据库操作, 使用泛型可以大大减少冗余代码

// 不同类每使用一次MysqlDb类,就需要再次修改.此时可用泛型
class MysqlDb<T>{
    add(info: T): boolean {
        return true
    }
}
class User {
    username: string | undefined;
    password: string | undefined
}
class Article {
    title: string | undefined;
    desc: string | undefined
}
var userDb = new MysqlDb<User>()
var articleDb = new MysqlDb<Article>()

泛型接口

当方法中使用到某些属性或者方法时, 此时用泛型会报错, 可以对泛型extends接口, 从而限制可使用的泛型类型

// function getName<T>(arg: T): T {
//     console.log(arg.name);  // 类型“T”上不存在属性“length”。
//     return arg;
// }

interface lengthInt {
    length: string
}
function getName<T extends lengthInt>(arg: T): T {
    console.log(arg.length);
    return arg;
}
let a = { length: '1' }
getName(a)

可以对在函数上使用泛型时使用接口限制函数, 从而控制函数中需要被泛型控制的部分

// 方法一
interface ConfigFn {
    <T>(value: T): T;
}

var getData: ConfigFn = function <T>(value: T): T {
    return value
}
getData<string>('sting') // 在执行时进行泛型类型指定


// 方法二
interface ConfigFn<T> {
    (value: T): T;
}
var setData = function <T>(value: T): T {
    return value
}
var mysetData: ConfigFn<string> = setData;
mysetData('string')