美文网首页
typescript中的泛型及泛型接口

typescript中的泛型及泛型接口

作者: 一号聪明 | 来源:发表于2019-10-05 22:53 被阅读0次

泛型:软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性。 组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵活的功能。

在像C#和Java这样的语言中,可以使用泛型来创建可重用的组件,一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。

通俗理解:泛型就是解决 类 接口 方法的复用性、以及对不特定数据类型的支持(类型校验)

只能返回string类型的数据

function getData(value:string):string{
    return value;
}

同时返回 string类型 和number类型 (代码冗余)

 function getData1(value:string):string{
    return value;
 }
 function getData2(value:number):number{
     return value;
 }

同时返回 string类型 和number类型 any可以解决这个问题(但是放弃了语法检测,传入什么就返回什么,这么做跟没写的区别一样)

  function getData(value:any):any{
     return '哈哈哈';
 }
 getData(123);
 getData('str');

泛型:可以支持不特定的数据类型 要求:传入的参数和返回的参数一直
T表示泛型,具体什么类型是调用这个方法的时候决定的

   function getData<T>(value:T):T{
        return value;
   }
   getData<number>(123);
   getData<string>('1214231');
   getData<number>('2112');       /*错误的写法*/  
   function getData<T>(value:T):any{    // 定义返回为任意值
      return '2145214214';
   }
   getData<number>(123);  //参数必须是number
   getData<string>('这是一个泛型');

泛型类:比如有个最小堆算法,需要同时支持返回数字和字符串 a - z两种类型。 通过类的泛型来实现

class MinClas<T>{

    public list:T[]=[];

    add(value:T):void{

        this.list.push(value);
    }

    min():T{        
        var minNum=this.list[0];
        for(var i=0;i<this.list.length;i++){
            if(minNum>this.list[i]){
                minNum=this.list[i];
            }
        }
        return minNum;
    }
}

var m1=new MinClas<number>();   /*实例化类 并且制定了类的T代表的类型是number*/
m1.add(11);
m1.add(3);
m1.add(2);
alert(m1.min())


var m2=new MinClas<string>();   /*实例化类 并且制定了类的T代表的类型是string*/
m2.add('c');
m2.add('a');
m2.add('v');
alert(m2.min())

泛型接口

接下来定义一个函数类型接口

interface Config{
  (value:string,data:string):string;
}
var setData:Config = funciton (value1:string,value2:string):string{
  return value1 + value2;
}
setData('name', '张三')

从上面代码中我们无法实现返回值同时为number和string类型 ,接下来通过泛型接口来改造上面代码实现。

1.
interface Config{
  <T>(data:T):T;
}
var getData:Config = function<T>(value:T):T{
  return value;
}
getData<string>('张三')
getData<string>(123)    // 错误写法。传入类型跟指定类型不否
2.
interface Config<T>{
  (value:T):T;
}
function getData<T>(value:T):T{
  return value;
}
var myGetData:Config<string> = getData;
myGetData('10');

相关文章

  • TS 泛型+装饰器

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

  • typescript中的泛型及泛型接口

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

  • TypeScript 学习笔记4 泛型

    1.泛型 1.1 泛型函数 1.2 泛型类 1.3 泛型接口 Typescript从0到1-学习视频教程-培训课程...

  • Typescript的泛型/泛型接口

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

  • Java 泛型

    泛型类 例如 泛型接口 例如 泛型通配符 泛型方法 类中的泛型方法 泛型方法与可变参数 静态方法与泛型 泛型上下边...

  • 泛型的使用

    泛型有三种使用方式,分别为:泛型类、泛型接口、泛型方法 泛型类 泛型接口 泛型通配符 泛型方法 静态方法与...

  • 泛型

    1.什么是泛型? 2.为什么需要泛型? 3.泛型类、接口 泛型类注意事项: 从泛型类派生子类 泛型接口 泛型接口的...

  • Java-API-集合框架(三)-泛型

    泛型的由来和基本使用 泛型的擦除 泛型类的使用 泛型方法的使用 泛型接口 泛型通配符(?) 通配符? 在api中的...

  • 重走安卓进阶路——泛型

    ps.原来的标题 为什么我们需要泛型? 泛型类、泛型接口和泛型方法(泛型类和泛型接口的定义与泛型方法辨析); 如何...

  • 泛型 & 注解 & Log4J日志组件

    掌握的知识 : 基本用法、泛型擦除、泛型类/泛型方法/泛型接口、泛型关键字、反射泛型(案例) 泛型 概述 : 泛型...

网友评论

      本文标题:typescript中的泛型及泛型接口

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