05_泛型

泛型

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

//通俗的讲，泛型就是解决类 接口 方法的复用性以及对不特定数据类型的支持
//1.返回字符串类型
function getData(value:string):string {
    return value;
}
//2.返回数字类型
function getData2(value2:number):number {
    return value2;
}

上面就出现了代码冗余的问题，代码重复太多。

// 解决办法：类型返回any类型，可以是任何类型，可以实现
function getData3(value3:any):any {
    return value3
}
getData3(123);
getData3('string');

但是上面使用了any可以实现，但是相当于放弃了类型的定义 这里使用泛型：要求传入的参数和返回的参数一致 T表示泛型，具体什么类型是调用这个方法的时候决定的，可以是任意的大写字母，但是我们推荐使用T

function getData4<T>(value:T):T {
    return value;
}
getData4<number>(123); // getData4<number>('111'); //这里定义了传入的数据类型是number，这里传入string就报错了
getData4<string>('gouzi'); //传入值可以自己定义，返回值可以是任何类型，但是这中写法不是很常用
function getData5<T>(value:T):any{
    return value;
}
getData5<number>(123);

泛型的应用

这个是最普通的一个类，里面有方法。但是这个类值只能传入数字同时只能对数字进行排序

class Minnum { //定义了一个Minnum类
    list:number[]=[];
    add(num:number){
        this.list.push(num)
    }
    min():number{
        let minnum = this.list[0];
        for (let i = 0; i <this.list.length ; i++) {
            if(minnum>this.list[i]){
                minnum = this.list[i];
            }
        }
        return minnum;
    }
}

var m = new Minnum();
m.add(99);
m.add(4);
m.add(3);
m.add(33);
console.log(m.list);
m.min();
console.log(m.min());

如果我们要对a-z进行排序这个就不行了。这就需要使用泛型了

class MinClass<T> { //使用T表示泛型
    list:T[]=[]; //这里list的数据变成了T泛型类型；当然这里也可以变成any类型
    add(num:T):void{ //传入数据变成泛型；没有返回值。同时有这里也可以变成any
        this.list.push(num)
    }
    min():T{ //min没有数据参数类型，返回值是一个泛型。后面都是自己写的
        let minnum = this.list[0];
        for (let i = 0; i <this.list.length ; i++) {
            if(minnum>this.list[i]){
                minnum = this.list[i];
            }
        }
        return minnum;
    }
}
//这里声明了m1，对数字进行排序
var m1 = new MinClass<number>(); //实例化类并且指定了T的类型为number
m1.add(99);
m1.add(4);
m1.add(5);
m1.add(33);
console.log(m1.list);
m1.min();
console.log(m1.min());

//这里有声明了m2，对字符串进行排序
var m2 = new MinClass<string>(); //实例化类并且指定了T的类型为string,字母的话有ascii码对应
m2.add('y');
m2.add('e');
m2.add('g');
m2.add('z');
console.log(m2.list);
m2.min();
console.log(m2.min());

泛型接口

//函数类型接口
interface ConfigFn {
    (value1:string,value2:string):string
}

var setData :ConfigFn = function (value1:string,value2:string):string {
    return value1 + value2;
}

console.log(setData('name', 'zhangsan'));

//泛型接口，这里和接口差不多，只是把数据类型变成了T
interface ConfigFnT {
    <T>(value3:T):T
}

var getDataT :ConfigFnT = function <T>(value3:T):T {
    return value3;
}
console.log(getDataT<string>('zhangsan'));
console.log(getDataT<number>(123456));