typescript中的泛型

泛型：軟件工程中，我們不僅要創建一致的定義良好的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;
    }

使用泛型后就可以解決這個問題

// T表示泛型，具體什么類型是調用這個方法的時候決定的

    function getData<T>(value:T):T{
        return value;
    }
     getData<number>(123);

     getData<string>('1214231');

泛型類：

//普通的類
class MinClass{
    public arr:number[]=[];
    add(value:number){
        this.arr.push(value);
    }
    min():number{
        var minNumber=this.arr[0];
        for(let i=0;i<this.arr.length;i++){
            if(minNumber>this.arr[i]){
                minNumber=this.arr[i]
            }    
        }
        return minNumber;
    }

}
var m=new MinClass();
m.add(12);
m.add(23);
m.add(5);
alert(m.min());//顯示5
//上面的有個問題就是你傳入的值只能是number類型，返回的也是number,如果傳入字符創就會報錯，解決辦法：泛型類
//定義泛型類
class MinClassT<T>{
    public arr:T[]=[];
    add(value:T){
        this.arr.push(value);
    }
    min():T{
        var minNumber=this.arr[0];
        for(let i=0;i<this.arr.length;i++){
            if(minNumber>this.arr[i]){
                minNumber=this.arr[i]
            }
        }
        return minNumber;
    }
}
var m1=new MinClassT<number>();
m1.add(15);
m1.add(16);
m1.add(7);
alert(m1.min());

var m2=new MinClassT<string>();
m2.add('a');
m2.add('b');
m2.add('c');
alert(m2.min());

泛型接口：

 interface ConfigFn{

           <T>(value:T):T;
   }


       var getData:ConfigFn=function<T>(value:T):T{

           return value;
       }


         getData<string>('張三');


          getData<string>(1243);  //錯誤

還有一種寫法：

interface ConfigFn<T>{
            (value:T):T;
        }


        function getData<T>(value:T):T{

            return value;
        }

        
        var myGetData:ConfigFn<string>=getData;     


        myGetData('20');  /*正確*/


        // myGetData(20)  //錯誤