美文网首页让前端飞Web前端之路web前端经典面试题
Typescript中的泛型的作用及使用场景

Typescript中的泛型的作用及使用场景

作者: 全栈弄潮儿 | 来源:发表于2019-08-13 16:40 被阅读5次

什么是TypeScript

TypeScript是由Microsoft Corporation开发和维护的面向对象的编程语言。它是JavaScript的超集,包含所有元素。

TypeScript完全遵循OOPS概念,在TSC(TypeScript编译器)的帮助下,我们可以将Typescript代码(.ts文件)转换为JavaScript(.js文件)。

为什么要使用TypeScript

TypeScript的设计目的应该是解决JavaScript的“痛点”:弱类型和没有命名空间,导致很难模块化,不适合开发大型程序。另外它还提供了一些语法糖来帮助大家更方便地实践面向对象的编程。

  • TypeScript简化了JavaScript代码,使其更易于阅读和调试。

  • TypeScript是开源的。

  • TypeScript为JavaScript IDE和实践提供了高效的开发工具,例如静态检查。

  • 使用TypeScript,我们可以比普通的JavaScript做出巨大的改进。

  • TypeScript为我们提供了ES6(ECMAScript 6)的所有优点,以及更高的工作效率。

  • TypeScript可以帮助我们避免开发人员通过类型检查代码编写JavaScript时经常遇到的痛苦错误。

  • 强大的类型系统,包括泛型。

  • TypeScript代码可以按照ES5和ES6标准进行编译,以支持最新的浏览器。

  • 支持静态类型。

  • TypeScript将节省开发人员的时间。

什么是泛型

泛型的本质是参数化类型,通俗的将就是所操作的数据类型被指定为一个参数,这种参数类型可以用在类、接口和方法的创建中,分别成为泛型类,泛型接口、泛型方法。

TypeScript中的泛型跟java中的泛型基本类似。

为什么使用泛型

TypeScript 中不建议使用 any 类型,不能保证类型安全,调试时缺乏完整的信息。

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('张三丰','诸葛亮'));

经典前端面试题每日更新,欢迎参与讨论,地址:https://github.com/daily-interview/fe-interview


更多angular1/2/4/5、ionic1/2/3、react、vue、微信小程序、nodejs等技术文章、视频教程和开源项目,请关注微信公众号——全栈弄潮儿

image

相关文章

  • Typescript中的泛型的作用及使用场景

    什么是TypeScript TypeScript是由Microsoft Corporation开发和维护的面向对象...

  • 面试要点(先学着)

    1.Java 1.1 Java基础 对抽象、继承、多态的理解 泛型的作用及使用场景 枚举的特点及使用场景 线程sl...

  • 泛型的作用及使用场景

    在没有泛型之前,从集合读取到的每一个对象都必须进行转换。如果有人不小心插入了类型错误的对象,在运行时的转换处理就会...

  • 泛型的作用及使用场景

    Android使用泛型的地方很多,比如集成自BaseAdapter实现封装的Adapter,对常用操作进行封装,但...

  • Java基础(一)

    Java要点1 JAVA基础 1.对抽象、继承、多态的理解 2.泛型的作用及使用场景 1.Java泛型是JDK1....

  • typescript 难点梳理

    1.new关键字在类型中的使用 泛型 在泛型里使用类类型 在TypeScript使用泛型创建工厂函数时,需要引用构...

  • typescript中的泛型及泛型接口

    泛型:软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同...

  • iOS中泛型的使用

    泛型的作用: 1.限制类型 泛型使用场景: 1.在集合(数组,字典,NSSet)中使用泛型比较常见.2.当声明一个...

  • typescript

    title: typescript学习tags: typescript学习 [toc] 泛型 基本使用 两种使用方...

  • TS 泛型+装饰器

    typescript 中的泛型 泛型的定义泛型函数泛型类泛型接口 泛型:软件工程中,我们不仅要创建一致的定义良好的...

网友评论

    本文标题:Typescript中的泛型的作用及使用场景

    本文链接:https://www.haomeiwen.com/subject/taebjctx.html