中文網(wǎng):https://www.tslang.cn/
官網(wǎng):http://www.typescriptlang.org/
目錄:
- Typescript 學(xué)習(xí)筆記一:介紹、安裝、編譯
- Typescript 學(xué)習(xí)筆記二:數(shù)據(jù)類型
- Typescript 學(xué)習(xí)筆記三:函數(shù)
- Typescript 學(xué)習(xí)筆記四:回憶Es5 中的類
- Typescript 學(xué)習(xí)筆記五:類
- Typescript 學(xué)習(xí)筆記六:接口
- Typescript 學(xué)習(xí)筆記七:泛型
泛型的定義
泛型:軟件工程中纹笼,我們不僅要創(chuàng)建一致的定義良好的 API妇多,同時也要考慮可重用性芯丧。 組件不僅能夠支持當(dāng)前的數(shù)據(jù)類型,同時也能支持未來的數(shù)據(jù)類型,這在創(chuàng)建大型系統(tǒng)時為你提供了十分靈活的功能。
在像C#和Java這樣的語言中圃酵,可以使用泛型來創(chuàng)建可重用的組件,一個組件可以支持多種類型的數(shù)據(jù)馍管。這樣用戶就可以以自己的數(shù)據(jù)類型來使用組件郭赐。
通俗理解:泛型就是解決類、接口确沸、方法的復(fù)用性捌锭、以及對不特定數(shù)據(jù)類型的支持(類型校驗)。
function getData (val:string):string {
return val;
}
只能返回string類型的數(shù)據(jù)罗捎,要求能同時返回 string 類型和 number 類型
function getData1 (val:string):string {
return val;
}
function getData2 (val:number):number {
return val;
}
代碼冗余舀锨,any 類型可以解決這個問題。
function getData (val:any):any {
return val;
}
getData(124);
getData('124');
但是 any 相當(dāng)于放棄了類型檢查宛逗。沒法實現(xiàn)傳入什么,返回什么盾剩。比如:傳入 number 類型必須返回 number 類型雷激,傳入 string 類型必須返回 string 類型。
function getData (val:any):any {
return val + '---';
}
getData(124); // 傳入 number告私,返回 string
泛型:可以支持不特定的數(shù)據(jù)類型屎暇。要求:傳入的參數(shù)和返回的參數(shù)一致。
T
表示泛型驻粟,具體什么類型是在調(diào)用這個方法的時候決定的
泛型函數(shù)
function getData<T> (val:T):T {
return val;
}
getData<number>(124);
getData<string>('abc');
// getData<number>('abc'); // 錯誤
放回值可以是任意類型
function getData<T> (val:T):any {
return val + '***';
}
getData<number>(124); // 參數(shù)必須是數(shù)字
getData<string>('abc');
泛型類
比如有個最小堆算法根悼,需要同時支持返回數(shù)字和字符串 a-z 兩種類型凶异。通過類的泛型來實現(xiàn)
class minClass {
list:number[] = [];
add (val:number):void {
this.list.push(val);
}
min ():number {
let minNum:number = this.list[0];
for(let i = 0; i < this.list.length; i++) {
if(minNum > this.list[i]){
minNum = this.list[i];
}
}
return minNum;
}
}
let m = new minClass();
m.add(3);
m.add(2);
m.add(23);
console.log(m.min()); // 2
正常的類只能實現(xiàn)一種類型。用泛型解決挤巡,支持 number 和 string剩彬。
class minClass<T> {
list:T[] = [];
add (val:T):void {
this.list.push(val);
}
min ():T {
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;
}
}
let m1 = new minClass<number>(); // 實例化類,并且指定了類的 T 代表的類型是 number
m1.add(3);
m1.add(2);
m1.add(23);
console.log(m1.min()); // 2
let m2 = new minClass<string>(); // 實例化類矿卑,并且指定了類的 T 代表的類型是 string
m2.add('a');
m2.add('d');
m2.add('f');
console.log(m2.min()); // a
泛型接口
函數(shù)類型接口
interface configFn {
(val1:string, val2:string):string;
}
let setData:configFn = function (value1:string, value2:string):string { // 參數(shù)名可以和接口中的不一致喉恋,但是參數(shù)類型必須一致
return value1 + value2;
}
setData('1', '2');
泛型接口實現(xiàn)方式1:
interface configFn {
<T>(val:T):T;
}
let getData:configFn = function<T> (value:T):T {
return value;
}
getData<string>('abc');
getData<number>(123);
泛型接口實現(xiàn)方式2:
interface configFn<T> {
(val:T):T;
}
let getData:configFn<string> = function<T> (value:T):T {
return value;
}
getData('abc');
getData(123); // 錯誤
這是最后一篇,之后更深入的學(xué)習(xí)和應(yīng)用了母廷,再繼續(xù)轻黑。_