TS泛型用法

泛型,可以理解为更广泛的类型。也就是说我们在函数、接口、类等中,约束数据类型的时候,可以通过泛型的方式来实现类型的传参,让数据的类型也可以根据传递的类型值来控制。

一、函数中的泛型

1、定义泛型函数

基础语法:

function 函数名<类型变量>(参数名: 类型变量): 类型变量 {
    return 返回值;
}

函数名<类型>(参数)

案例代码:

function getValue<T>(params: T): T {
    return params;
}

getValue<string>('hello');
getValue<number>(100);

2、定义多个泛型变量

function getValue<T, U>(params: T, count: U): T {
    return params;
}

getValue<string, number>('hello', 100);
getValue<boolean, number>(true, 100);

二、接口中的泛型

基础语法:

interface 接口名<类型变量> {
    属性名: 属性类型,
    属性名: 类型变量,
}

const 变量名: 接口名<类型> = ...

案例代码:

interface Info<T> {
    id: number;
    name: string,
    age: T
}

let student: Info<number> = {
    id: 1, 
    name: '张三',
    age: 20
}

let users: Info<string> = {
    id: 1, 
    name: '王五',
    age: '30'
}

三、class 中的泛型

class 类名<类型变量>{
	属性名:类型变量
	constructor(参数名:类型变量){
	
	}
	方法名(参数名:类型变量):类型变量{
   return 返回值
	}
}

案例
在这里插入图片描述

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值