泛型的概念

指不预先确定的数据类型,具体的类型要在使用的时候才能确定。咋一听,是不是觉得JavaScript本身就是这样?这是由于理解有误。前面说“在使用的时候确定”,而非在程序执行的时候确定。

泛型函数

现在有个需求:一个被定义的函数原本输入字符串输出字符串,现在想让它同时支持输入输出字符串数组,如何实现?

1.通过函数重载

// 函数调用时依照声明的顺序进行匹配
function log(value: string): string;
function log(value: string[]): string[];function log(value: any): any{console.log(value);return value;
}
log("abc");
log(["10","abc"]);

2.使用联合参数

function logs(value: string | string[]): string | string[]{return value
}

以上两种都OK,但是不够简洁,不够灵活。下面使用泛型。

function log1<T>(value: T): T{return value
}
等价于
let log1 = <T>(value: T) => {return value
};
log1<string>("hello");   // 调用的时候指定类型
log1<string[]>(["hi","ha"]);

泛型接口

// 要注意<T>的位置,前者在使用时必须指定类型,后者在使用时无须指定类型
interface Log<T> {(value: T): T;
}
let log3: Log<number> = (v) => { console.log("必须指定类型",v);return v };
log3(12);interface Log{<T>(value: T): T;
}
let log3: Log = (v) => { console.log("无须指定类型",v);return v};
log3<number>(10); // 无须指定类型,如果要指定类型,在调用的时候指定
log3(5);

泛型类

对类的成员进行约束,注意不能约束静态成员。

class Log<T> {run(value: T) {console.log(value);return value}
}
let log1 = new Log<number>(); // 可以进行约束
log1.run(1);
let log2 = new Log(); // 也可以不进行约束
log2.run("2");

泛型约束

泛型约束是指,传入的参数必须符合约束,不符合约束的参数无法传入。

function log<T>(value: T):T{console.log(value.length); // 如果访问.length属性,TS编译器会报错,因为不知道value有没有这个属性return value
}
此时使用泛型约束
interface Length {length: number;type?: string;
}
// extends Length表示允许value参数通过.操作符访问Length中定义的属性
function log<T extends Length>(value: T): T{console.log(value, value.length,value.type);return value
}
// 所有具有length属性的值,都可以被当做参数传入log函数
log([1,2,3]);
log("123");
log({length: 1});

在这个例子中,约束传入的参数必须具有length属性

使用泛型有什么好处?

  1. 函数和类可以支持多种类型,增强程序的扩展性。
  2. 不必写多条函数重载、冗长的联合类型声明,增强代码可读性。
  3. 灵活控制类型之间的约束

转载于:https://www.cnblogs.com/V587Chinese/p/11474391.html

TypeScript泛型相关推荐

  1. 泛型 typescript_如何把你的头围绕Typescript泛型

    泛型 typescript by Nadeesha Cabral 通过Nadeesha Cabral 如何把你的头围绕Typescript泛型 (How to wrap your head aroun ...

  2. TypeScript - 泛型

    前言 本文主要记录下 TypeScript 泛型知识点,日常学习总结篇. 一.概念 泛型(Generics)是指在定义函数.接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性. ...

  3. TypeScript泛型约束

    泛型约束 有了泛型之后,一个函数或容器类能处理的类型一下子扩到了无限大,似乎有点失控的感觉.所以这里又产生了一个约束的概念.我们可以声明对类型参数进行约束. 我们还拿上文中的student栗子来说,想 ...

  4. TypeScript泛型详解

    泛型 泛型(Generics)是指在定义函数.接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性. 示例 我们先实现一个student方法获取不同属性来看看使用: JavaScr ...

  5. TypeScript泛型工具

    Required 将类型的属性变成必选 interface Person {name?: stringage?: numberhobby?: string[] }// 下面的类型不用定义, TypeS ...

  6. TypeScript 泛型T使用整理

    一.介绍 相C#和Java等以上,TypeScript可以使用泛型来创建可重用的组件.支持当前数据类型,同时也能支持未来的数据类型.扩展灵活. 二.泛型的定义.使用 使用泛型可以创建泛型函数.泛型接口 ...

  7. 【TS】1368- 秒懂 TypeScript 泛型工具类型!

    阿宝哥精心准备的<轻松学 TypeScript> 视频教程已经更新到第十九期了,合集播放量已达 14W+.通过形象生动的动画,让你轻松搞懂 TypeScript 的难点和核心知识点! 如果 ...

  8. TypeScript 泛型

    TS里面有泛型让我很意外,这个比AS3确实要强大: let myIdentity_change : <T>(arg:T)=>T=function(a){ return a };con ...

  9. Typescript泛型与implements子句

    一.泛型的基本使用 与extends的区别 泛型可以理解为宽泛的类型,通常用于类和函数.使用的时候我们再指定类型 泛型不仅可以让我们的代码变得克加健壮,还能让我们的代;码在变得键壮的r时保持灵活性和可 ...

最新文章

  1. slot没有毁灭的问题_解析flink之perjob模式下yn参数不生效问题
  2. css网页布局中文字排版的属性和用法
  3. 前端学习(1843):前端面试题之vue管理状态
  4. 【pyQT5】Python3+pyQT5开发环境安装与配置
  5. lisp 发凹圆角_css能实现这样的内凹圆角吗?如何实现?具体代码是!!
  6. 工业4.0围观,大炒作,大问题,大差距,你发现了吗?
  7. mongodb的副本集总结
  8. 配置本地DNS服务器地址
  9. total commander最近修改标红
  10. 姿态估计论文汇总 Stacked Hourglass/CPN/Simple Baselines/MSPN/HRNet
  11. 如何将论文中的公式图片直接变为word中的公式
  12. 简单介绍一下HBase、Cassandra、Voldemort、Redis、VoltDB、MySQL(转)
  13. 什么是跨域问题?跨域解决问题
  14. django模板使用
  15. 荧光发射和荧光寿命 [Lifetime] 的工作原理
  16. Openharmony应用NAPI详解--进阶篇1
  17. 计算机图形学实验报告 裁剪,计算机图形学-实验报告三-图形裁剪算法
  18. 如何解决svn is not a working copy
  19. Java(35):Java Base64编码和解码工具类
  20. 【PyTorch系列】找不到d2lzh_pytorch包,No module named ‘d2lzh_pytorch’

热门文章

  1. mysql all语法怎么用_MySQL UNION 与 UNION ALL 语法与用法
  2. 大数据与数据挖掘考试题_2017-2019年全国Ⅱ卷高考考点数据分析(理综合)
  3. win10安装部署网络测试工具 NetCat 用于Spark跑测试
  4. ROS2学习(四).ROS 2 核心概念
  5. php获取其他php文件变量值,php 引入其他文件中的变量
  6. 如何把ajax改成同步请求,如何将Ajax请求从异步改为同步
  7. python 子线程coredump_python多线程备份mysql数据工具:mysqlpdump使用方法
  8. nodejs正则提取html,Nodejs正则表达式函数之match、test、exec、search、split、replace
  9. 数学--数论--随机算法--Pollard Rho 大数分解算法(纯模板带输出)
  10. 疯子的算法总结(九) 图论中的矩阵应用 Part 2 矩阵树 基尔霍夫矩阵定理 生成树计数 Matrix-Tree