Typescript中的泛型的使用

泛型与Lambda表达式

最新推荐文章于 2025-05-16 12:08:59 发布

原创最新推荐文章于 2025-05-16 12:08:59 发布 · 4k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #泛型

Typescript 专栏收录该内容

44 篇文章

订阅专栏

本文介绍了 TypeScript 中泛型的基本用法及Lambda表达式的定义，通过具体实例展示了泛型函数和泛型类的创建与使用，并探讨了泛型在不同场景下的应用。

泛型的初步举例

function Hello1(num:number):number {
	return num; 
}

// 避免如下使用方式
function Hello2(str:any):any{
	return ;
}

// 使用泛型避免any,使用泛型实现， Hello2是泛型，参数是泛型，返回值是泛型
function Hello2<T>(arg:T):T {
	return arg;
}

// 创建一个string类型的Hello2
var output = Hello2<string>('Joh'); 
console.log(output); // Joh

// 错误的实现, 如果Hello指定了是string类型的，那么参数不能换成number类型的
// var output2 = Hello2<string>(10);

对泛型的更多应用


// 泛型可以用多种形式来表示，泛型根据你所传递的类型来决定具有那些属性的
function Hello<K>(num:K):K {
	// console.log(num.length); // 此时的错误的，因为我们传递类型不确定有length
	return num;
}

function Hello2<K>(num:K[]):K[] {
	console.log(num.length); // 此时是可以的
	return num;
}

var list:Array<string> = Hello2<string>(['1', '2', '3']);

for(var i = 0; i < list.length; i++) {
	alert(list[i]);
}

泛型的类型使用

案例一：


function Hello<T>(arg:T):T {
	return arg;
}

var myHello:<K>(arg:K) => K = Hello;

console.log(myHello('hello Joh'));

关于 Lambda 表达式


var myFunc:(a:number) => string = function(a:number):string{
	return "Hello" + a;
}

console.log(myFunc(2));


// ts 本身就具有类型检查，上面我们的完全可以这样写：
var myFunc1 = function(a:number):string {
	return "Hello1" + a;
}

console.log(myFunc1(2));

案例二：

function Hello<T>(arg:T):T {
	return arg;
}

var myHello:{<T>(arg:T):T} = Hello;

console.log(myHello('Hello'));

案例三：


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

function myHello<T>(arg:T):T {
	return arg;
}

var MH:Hello = myHello;
console.log(MH('hello'));
console.log(MH<string>('hello'));

案例四：

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

function myHello<T>(arg:T):T {
	return arg;
}

var mh:Hello<number> = myHello;
console.log(mh(100));

泛型类


class HelloNumber<T> {
	zero: T;
	add:(x:T, y:T) => T;
}

var myHelloNumber = new HelloNumber<number> ();
myHelloNumber.Ten = 10;
myHelloNumber.add = function(x,y) {
	return x+y;
}
alert(myHelloNumber.Ten); // 10
alert(myHelloNumber.add(10, 10)); // 20