typeScript ---泛型

最新推荐文章于 2025-05-21 11:25:18 发布

chen_晨风

最新推荐文章于 2025-05-21 11:25:18 发布

阅读量255

点赞数

CC 4.0 BY-SA版权

分类专栏： # typescript

本文链接：https://blog.youkuaiyun.com/qq_37674616/article/details/83986618

typescript 专栏收录该内容

5 篇文章

订阅专栏

本文深入探讨了泛型编程的概念，展示了如何通过泛型使组件支持当前及未来数据类型，保持输入输出数据类型的一致性。文章详细讲解了泛型函数、泛型类的定义与使用，以及泛型约束的应用，提供了丰富的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

泛型

可以使组件不仅能够支持当前的数据类型，同时也能够支持未来的数据类型。并且可以保证输入与输出的数据类型一致。

泛型函数

定义泛型函数

//泛型函数l类型声明
type IdentityFunc=<T>(arg:T)=>T;

//泛型函数声明
let identity:IdentityFunc=<T>(arg:T):T=>arg;

//===等价
function identity<T>(arg: T): T {
return arg;
}
let IdentityFunc: <T>(arg: T) => T = identity;

使用接口定义

interface IdentityFuncSame{
<T>(arg: T): T;
}

//等价于对象字面量定义

function identity<T>(arg:T):T{

retrun arg;

}

let IdentityFunc:{<T>:(arg:T):T}=identity

使用泛型函数

let output=identity<string>('Mary')

泛型类

定义泛型类

class GenericNumber<T>{
    zeroValue: T;
    add: (x: T, y: T) => T;
}

泛型约束

//定义一个拥有length属性的类
interface LengthWise{
    length:Number;
}
function LoggingIdentity<T extends LengthWise>(arg:T):T{
       console.log(arg.length);
        return arg;
}

使用泛型类

let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 1;
myGenericNumber.add = function (x, y) { return x * y };
let num=myGenericNumber.add(2, 2);
console.log(num);

使用构造函数

//定义构造函数类型的别名
type Tconstructor<T> = { new(name: string): T };
//或者采用接口定义方式
interface Iconstructor<T>{
    new(name:string):T;
}

//定义泛型函数
function create<T>(c:Tconstructor<T>,name:string ): T{
    return new c(name);
}

//定义一个Person类型
class Person { 
    constructor(private _name:string) { 
        this._name = _name;
    }
    public get name() {
        return this._name;
    }
}
const mary = create(Person, 'cc');
console.log(mary.name);