泛型是程序设计语言中的一种风格或范式,相当于类型模板,允许在声明类、接口或函数等成员时忽略类型,而在未来使用时再指定类型,其主要目的是为它们提供有意义的约束,提升代码的可重用性。

一、泛型参数

  当一个函数需要能处理多种类型的参数和返回值,并且还得约束它们之间的关系(例如类型要相同)时,就可以采用泛型的语法,如下所示。

function send<T>(data: T): T {
return data;
}

  函数名称后面跟了<T>,其中把T称为泛型参数或泛型变量,表示某种数据类型。注意,T只是个占位符,可以命名的更含语义,例如TKey、TValue等。在使用时,既可以指定类型,也可以利用类型推论自动确定类型,如下所示。

send<number>(10);        //指定类型
send(10);   //类型推论

  当需要处理T类型的数组时,可以像下面这么写。

function send<T>(data: T[]): T[] {
return data;
}
send<number>([1, 2, 3]);

  当指定一个泛型函数的类型时,需要包含泛型参数,如下所示,其中泛型参数和函数参数的名称都可与定义时的不同。

let func: <U>(data: U) => U = send;

  泛型参数还支持传递多个,只需在声明时增加类型占位符即可。在下面的示例中,将T和U合并成了一个元组类型,还有许多其它用法,将在后面讲解。

function send<T, U>(data: [T, U]): [T, U] {
return data;
}
send<number, string>([1, "a"]);

二、泛型接口

  在接口中,可利用泛型来约束函数的结构,如下所示,接口中声明的调用签名包含泛型参数。

interface Func {
<T>(str: T): T;
}
function send<T>(str: T): T {
return str;
}
let fn: Func = send;

  泛型参数还可以作为接口的一个参数存在,即把用尖括号包裹的泛型参数移到接口名称之后,如下所示。

interface Func<T> {
(str: T): T;
}
function send<T>(str: T): T {
return str;
}
let fn: Func<string> = send;

  当把Func接口作为类型使用时,需要向其传入一个类型,例如上面赋值语句中的string。

三、泛型类

  泛型类与泛型接口类似,也是在名称后添加泛型参数,如下所示,其中send属性中的“=>”符号不表示箭头函数,而是用来定义方法的返回值类型。

class Person<T> {
name: T;
send: (data: T) => T;
}

  在实例化泛型类时,需要为其指定一种类型,如下所示。

let person = new Person<string>();
person.send = function(data) {
return data;
}

  注意,类的静态部分不能使用泛型参数。

四、泛型约束

  在使用泛型时,由于事先不清楚参数的数据类型,因此不能随意调用它的属性或方法,甚至无法对其使用运算符。在下面的示例中,访问了data的length属性,但由于编译器无法确定它的类型,因此就会报错。

function send<T>(data: T): T {
console.log(data.length);
return data;
}

  TypeScript允许为泛型参数添加约束条件,从而就能调用相应的属性或方法了,如下所示,通过extends关键字约束T必须是string的子类型。

function send<T extends string>(data: T): T {
console.log(data.length);
return data;
}

  在添加了这个约束之后,send()函数就无法接收数字类型的参数了,如下所示。

send("10");        //正确
send(10); //错误

1)创建类的实例

  在使用泛型创建类的工厂函数时,需要声明T类型拥有构造函数,如下所示。

class Programmer { }
function create<T>(ctor: {new(): T}): T {
return new ctor();
}
create(Programmer);

  用“{new(): T}”替代原先的类型占位符,表示可以被new运算符实例化,并且得到的是T类型,另一种相同作用的写法如下所示。

function create<T>(ctor: new()=>T): T {
return new ctor();
}

2)多个泛型参数

  在TypeScript中,多个泛型参数之间也可以相互约束,如下所示,创建了基类Person和派生类Programmer,并将create()函数中的T约束为U的子类型。

class Person { }
class Programmer extends Person { }
function create<T extends U, U>(target: T, source: U): T {
return target;
}

  当传递给create()函数的参数不符合约束条件时,就会在编译阶段报错,如下所示。

create(Programmer, Person);        //正确
create(Programmer, 10); //错误

TypeScript躬行记(4)——泛型的更多相关文章

  1. TypeScript躬行记(1)——数据类型

    TypeScript不仅支持JavaScript所包含的数据类型,还额外扩展了许多实用的数据类型,例如枚举.空值.任意值等. 一.JavaScript的数据类型 JavaScript的数据类型包括6种 ...

  2. TypeScript躬行记(5)——类型兼容性

    TypeScript是一种基于结构类型的语言,可根据其成员来描述类型.以结构相同的Person接口和Programmer类为例,如下所示. interface Person { name: strin ...

  3. TypeScript躬行记(8)——装饰器

    装饰器(Decorator)可声明在类及其成员(例如属性.方法等)之上,为它们提供一种标注,用于分离复杂逻辑或附加额外逻辑,其语法形式为@expression.expression是一个会在运行时被调 ...

  4. TypeScript躬行记(6)——高级类型

    本节将对TypeScript中类型的高级特性做详细讲解,包括交叉类型.类型别名.类型保护等. 一.交叉类型 交叉类型(Intersection Type)是将多个类型通过“&”符号合并成一个新 ...

  5. TypeScript躬行记(2)——接口

    在传统的面向对象语言中,接口(Interface)好比协议,它会列出一系列的规则(即对行为进行抽象),再由类来实现这些规则.而TypeScript中的接口更加灵活,除了包含常规的作用之外,它还能扩展其 ...

  6. TypeScript躬行记(3)——类

    类是对对象的抽象,描述了对象的特征和行为,而对象就是类的实例.ES6引入了类的概念(相关内容可参考ES类和ES6类的继承两节),TypeScript在此基础上,不仅根据ES7等规范完善了类的语法,还添 ...

  7. TypeScript躬行记(7)——命名空间

    TypeScript中的命名空间可将那些具有内在联系的接口.类或对象等代码组织在一起,既能隔离作用域,也能避免命名冲突,并且使得代码结构清晰,更易追踪.在命名空间内部,所有实体部分默认都是私有的,需要 ...

  8. ES6躬行记(1)——let和const

    古语云:“纸上得来终觉浅,绝知此事要躬行”.的确,不管看了多少本书,如果自己不实践,那么就很难领会其中的精髓.自己研读过许多ES6相关的书籍和资料,平时工作中也会用到,但在用到时经常需要上搜索引擎中查 ...

  9. ES6躬行记 笔记

    ES6躬行记(18)--迭代器 要实现以下接口## next() ,return,throw 可以用for-of保证迭代对象的正确性 例如 var str = "向

随机推荐

  1. spring boot中表单验证的使用

    一.前言 为啥子要搞这个表单验证呢?答案简单而现实,举个栗子,你辛辛苦苦的写了一个录入个人信息的功能,比如年龄这个位置,用户就没看到一下子写了个性别男,一提交,直接报错了,是不是很尴尬呢, 作为一个测 ...

  2. 机器学习-Pandas 知识点汇总(吐血整理)

    Pandas是一款适用很广的数据处理的组件,如果将来从事机械学习或者数据分析方面的工作,咱们估计70%的时间都是在跟这个框架打交道.那大家可能就有疑问了,心想这个破玩意儿值得花70%的时间吗?咱不是还 ...

  3. 编译GLib C程序

    编译GLib C程序 GLib是GTK +所需的实用程序库,但也可以在非GUI应用程序中独立使用.本文介绍如何在Linux中编译使用GLib的C程序.它还显示了如何为系统上安装的GLib版本安装正确的 ...

  4. JS进阶——this绑定了谁?

    一.this的意义 二.寻找this绑定对象 经常听到这么一句话,找this只需要看谁是调用方.当函数被调用时会记录函数调用调用方式.传参包括this等各种属性.有时候this绑定对象情况太抽象,找到 ...

  5. [Abp vNext 源码分析] - 14. EntityFramework Core 的集成

    一.简要介绍 在以前的文章里面,我们介绍了 ABP vNext 在 DDD 模块定义了仓储的接口定义和基本实现.本章将会介绍,ABP vNext 是如何将 EntityFramework Core 框 ...

  6. TensorFlow——学习率衰减的使用方法

    在TensorFlow的优化器中, 都要设置学习率.学习率是在精度和速度之间找到一个平衡: 学习率太大,训练的速度会有提升,但是结果的精度不够,而且还可能导致不能收敛出现震荡的情况. 学习率太小,精度 ...

  7. git利用hooks实现自动部署

    准备工作: 1.一台虚拟linux环境和window 开始工作 1.安装git(略) 2.创建git用户和创建test.git裸仓库 [root@localhost ~]# useradd -m gi ...

  8. python继承简介

    继承 是面向对象的三大特性之一 作用: 通过继承可以使一个类获取其它类中的属性和方法 使用方法: 在定义类时,可以在类名后的括号中指定当前类的父类(超类.基类.super) 这样子类(衍生类)就可以直 ...

  9. 深夜话题boot2docker还有那些隐藏MENU

    马克思的博士论文:自由意识的集中表达 --字体我设为5(18pt),你们懂的 总有人埋汰,终于我想起一个负负得正的话题 为什么放在深夜,因为希望看到的人越少越好,深夜是时差党的乐园 本篇作为之前几篇围 ...

  10. python爬虫——scrapy的使用

    本文中的知识点: 安装scrapy scrapy的基础教程 scrapy使用代理 安装scrapy 由于小哥的系统是win7,所以以下的演示是基于windows系统.linux系统的话,其实命令都一样 ...