typescript---泛型

2020-02-12  本文已影响0人  成熟稳重的李先生

泛型(Generics)是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性
泛型T作用域只限于函数内部使用

  1. 泛型函数
function createArray(length: number, value: any): Array<any> {
    let result: any = [];
    for(let i=0;i<length;i++){
        result[i] = value;
    }
    return result;
}
let result = createArray(3,'x');
console.log(result);

使用泛型后

function createArray<T>(length: number, value: T): Array<T> {  //这样,就约束了返回数组的类型
        let result: T[] = [];
        for(let i=0;i<length;i++){
            result[i] = value;
        }
        return result;
}
let arr = createArray<number>(3, 5);  
let arr = createArray<number>(3, "a");
  1. 泛型类
    class Person<T> {  // T的作用域是整个类
        private list: T[] = [];
        add(value: T) {
            this.list.push(value);
        }
        getMax() {
            let result: T = this.list[0];
            for(let i =1;i<this.list.length;i++){
                if(this.list[i] > result){
                    result = this.list[i];
                }
            }
            return result;
        }
    }

3.泛型接口

interface Caculate {
  <T>(a: T, b: T): T
}
const add: Caculate = function <T>(a: T, b: T): T{
    return a
}
add<number>(3,5)
add<number>(3,"5") //报错,此处T是number,“5”是字符串
  1. 多个类型参数
function swap<A, B>(touple: [A, B]): [B, A] { //touple是元组
    return [touple[1], touple[0]]
}
let swapped = swap<string,number>(['a',1]);
console.log(swapped);
console.log(swapped[0].toFixed(2));
console.log(swapped[1].length);
  1. 默认泛型类型
function createArray3<T=number>(length: number, value: T): Array<T> {
  let result: T[] = [];
  for (let i = 0; i < length; i++) {
    result[i] = value;
  }
  return result;
}
let result2 = createArray3(3,3);
let result3 = createArray3<string>(3,'3');
  1. 泛型约束
function logger<T>(val: T) {
    console.log(val.length); //直接访问会报错,因为T类型未知,不一定有length属性
}
interface LengthWise {
    length: number
}

//可以让泛型继承一个接口
function logger2<T extends LengthWise>(val: T) {
    console.log(val.length)
}
logger2('lc');  // 2
logger2({length: 5});  //5
logger2(1); //报错,1或者new Number(1)都没有length属性
  1. 泛型接口
interface Cart<T>{
  list:T[]
}
let cart:Cart<{name:string,price:number}> = {
  list:[{name:'zhufeng',price:10}]
}
console.log(cart.list[0].name,cart.list[0].price);
  1. 泛型类型别名
type Cart<T> = {list:T[]} | T[];  //联合类型
let c1:Cart<string> = {list:['1']};
let c2:Cart<number> = [1];
  1. 泛型接口 vs 泛型类型别名
上一篇 下一篇

猜你喜欢

热点阅读