一、介绍

相C#和Java等以上,TypeScript可以使用泛型来创建可重用的组件。支持当前数据类型,同时也能支持未来的数据类型。扩展灵活。

二、泛型的定义、使用

使用泛型可以创建泛型函数、泛型接口,泛型类

1.使用泛型变量

//泛型变量的使用
function identity<T>(arg:T):T{console.log(typeof arg);return arg;
}
let output1=identity<string>('myString');
let output2=identity('myString');
let output3:number=identity<number>(100);
let output4:number=identity(200);
//使用集合的泛型
function loggingIdentity<T>(arg:Array<T>):Array<T>{console.log(arg.length);return arg;
}
loggingIdentity([1,2,3]);

2.定义泛型函数

//泛型函数
function identity<T>(arg:T):T{return arg;
}
let myIdentity:{<T>(arg:T):T}=identity;

3.定义泛型接口

//泛型接口
interface GenericIdentityFn<T> {(arg: T): T;
}
function identity<T>(arg: T): T {return arg;
}
let myIdentity: GenericIdentityFn<number> = identity;

4.定义泛型类

//泛型类
class GenericNumber<T>{zeroValue:T;add:(x:T,y:T)=>T;
}
let myGenericNumber=new GenericNumber<number>();
myGenericNumber.zeroValue=0;
myGenericNumber.add=function(x,y){return x+y;};
console.info(myGenericNumber.add(2,5));
let stringNumberic=new GenericNumber<string>();
stringNumberic.zeroValue='abc';
stringNumberic.add=function(x,y){return `${x}--${y}`};
console.info(stringNumberic.add('张三丰','王小明'));

三、泛型约束

1.使用 extends指定泛型类型的继承关系

//泛型约束 extends执行类型的继承关系
interface Lengthwise {
length: number;
}
function loggingIdentity<T extends Lengthwise>(arg: T): T {
console.log(arg.length);
return arg;
}
loggingIdentity({ length: 2, value: 3 });

2.指定泛型类型为类类型的约束

//在泛型中使用类类型约束
function create<T>(c: { new (): T; }): T {return new c();
}

一个更高级的例子,使用原型属性推断并约束构造函数与类实例的关系。

//泛型使用实例
class BeeKeeper {hasMask: boolean;
}class ZooKeeper {nametag: string;
}class Animal {numLegs: number;
}class Bee extends Animal {keeper: BeeKeeper;
}class Lion extends Animal {keeper: ZooKeeper;
}function createInstance<A extends Animal>(c: new () => A): A {return new c();
}
createInstance(Lion).keeper.nametag;  // typechecks!
createInstance(Bee).keeper.hasMask;   // typechecks!

更多:

TypeScript 函数使用整理

TypeScript 类使用整理

TypeScript 接口介绍

TypeScript 泛型T使用整理相关推荐

  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. 【TS】1368- 秒懂 TypeScript 泛型工具类型!

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

  7. TypeScript 泛型

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

  8. TypeScript泛型

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

  9. Typescript泛型与implements子句

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

最新文章

  1. 有意思的。带情感的语音转换,可以下载!
  2. 深入理解Android中View
  3. server sql top速度变慢解决方案_SQL Server的性能调优:解决查询速度慢的五种方法-数据库...
  4. Java 处理表格,也很轻松
  5. 【Es】es修改mapping报错Validation Failed: 1: mapping type is missing
  6. 加泰罗尼亚理工大学 计算机 排名,西班牙加泰罗尼亚理工大学排名
  7. python安装-在Python中安装包的三种方法
  8. 活动报名 | 前端攻城狮该怎样跳脱“围城”的焦虑
  9. 集成hello到OpenDaylight发行版中
  10. 《python源代码分析》笔记 pythonVM一般表达式
  11. 【蓝桥杯单片机组模块】13、NEC 红外通信 - vs1838B
  12. 计算机里的本地安全策略在哪找,本地安全策略哪里去了?
  13. leetcode 之 Merge k Sorted Lists
  14. java cobar_alibaba的COBAR真是强大.
  15. 9.2 5道半leetcode+2verilog+ques lists
  16. 5. 块定义(AttributeDefinition)
  17. 2019全球IT行业薪酬报告:平均年薪超70万!最高薪职位竟是...
  18. 强化Play To Earn生态,链游新势力海姆达尔Heimdallr蓄势待发
  19. ubuntu平台下编译vlc-android视频播放器实践
  20. Zoj 3587 Marlon's String (KMP 字符串拼接 前缀出现次数)

热门文章

  1. 高一职上册计算机技能考试,职高数学高一基础模块上册
  2. 洛谷P1607 [USACO09FEB]庙会班车Fair Shuttle
  3. spicy(一)基本定义
  4. 阿里 c语言开发工程师,阿里巴巴2014秋季校园招聘软件研发工程师笔试题
  5. js校验图片是否加载成功或失败
  6. HTTPS协议原理透析
  7. 附子理中丸,人参健脾丸,参苓白术散、补脾益肠丸、痛泻宁颗粒
  8. BZOJ3827[Poi2014] Around the world
  9. linux bind升级,bind9.2升级bind9.9
  10. docker 批量删除images