TypeScript入门(三)

一些定义性的文字也是截取的能够从页面上了解意思,别人总结还是很有用的,更加深刻一些;

泛型: 软件工程中,在创建一致的定义良好的api时也要考虑到可重用性;组件不仅能够支持当前的数据类型,同时也能够支持未来数据类型;

泛型就是解决 类 接口 方法的复用性,以及对不特定数据类型的支持;要求:输如的参数很返回的参数一致;

(1)泛型变量,类;

//1.同时返回string或number类型
//any虽然可以,但是放弃了类型检查在return时候;现在需要传入某种类型,返回也是该类型;
// T表示泛型,具体什么类型是调用这个方法的时候决定的

function getData<T>(value: T):T {
   return value;
}
getData<number>(123) //<>和()数据类型一致;

//2.泛型类,比如最小堆算法,需要同时支持返回数字和字符串两种类型。通过类的泛型来实现
class MinClass{
  public list: number[] = [];
  add(num:number){
    this.list.push(num)
  }
  min(){
    var minNum = this.list[0];
    for(var i = 0; i < this.list.lenth;i ++){
       if(minNum > this.list[i]){
         minNum = this.list[i];
       }
    }
    return minNum;
  }
}
var m = new MinClass();
m.add(2);
m.add(32);
m.min(); //2

2.类的泛型
class MinClass<T>{
  public list: T[] = [];
  add(value: T): void{
    this.list.push(value);
  }
  min(): T{
    for(var i = 0; i < this.list.lenth;i ++){
       if(minNum > this.list[i]){
         minNum = this.list[i];
       }
    }
    return minNum;
  }
}
var mi = new MinClass<number>(); //实例化类 并且制定了T代表的类型是number;
mi.add(1);
mi.add(5);
mi.min(); //1

(2)泛型接口

//1.函数类型接口
interface Config{
  (value1: string,value2: string): string;
}
var setData: ConfigFn = function(value1: string,value2: string): string{
  return value1 + value2;
}
setData('name','xiaoming');

//2. 泛型接口
interface Config{
  <T>(value: T): T;
}
var getData: ConfigFn = function<T>(value: T): T{
  return value;
}
getData<string>('xiaoming');
//第二种方法
var myGetData: ConfigFn<string> = getData;
myGetData('12'); //必须和泛型接口类型一致;

发现我跟人的学习方法还是比较笨的那种类型,很浪费时间,但是不敲又不能熟记,虽然敲了也不一定能记住;熟能生巧,哈哈。

上一篇:react+ts+antd 踩坑之旅 2、配置alias别名


下一篇:(贪心) leetcode 121. Best Time to Buy and Sell Stock