Skeanmy / Zero2One

学习笔记的仓库
0 stars 1 forks source link

【Typescript】泛型 #10

Open Skeanmy opened 4 years ago

Skeanmy commented 4 years ago

TypeScript

泛型

可以理解为不确定的类型,适用于需要复用的场景,而不需要对每一种类型都定义一种解决方法。

泛型函数与非泛型函数

function fn<T>(arg: T[]): T{}
// 非泛型函数的类型
(arg: any) => any
// 泛型函数的类型
<T>(arg: T) => T
// 多个类型参数
function fn3 <T,U> ( first:T, last:U  ) {}
// 泛型函数支持对象字面量写法
function fn4 <T>(arg:T) : T{
  return arg;
}
let Fn4: <P>(arg: P) => P = fn4;
let fn: { <T>(arg: T): T }  = fn1;

泛型接口

// 任意函数的接口
interface Fn1Inter {
  (arg: any): any
}
// 泛型函数的接口
interface Fn2Inter {
  <T>(arg: T): T
}
// 泛型接口     
interface Fn3Inter<T> {
  (arg: T): T
}

function fn<T> (arg:T) : T{
  return arg;
}
let Fn:Fn3Inter<string> = fn;

泛型类

class InterClass<T> {
}
new InterClass<number>

// 一个求数组最小值的泛型类
class GetMin<T>{
  arr: T[] = [];
  add(ele: T) {
    this.arr.push(ele);
  }
  min(): T {
    let min = this.arr[0];
    this.arr.forEach((value) => {
      if (value < min) {
        min = value;
      }
    })
    return min;
  }
}
let getMinNumber = new GetMin<number>();
getMinNumber.add(1);
getMinNumber.add(3);
getMinNumber.add(5);
console.log(getMinNumber.min());

泛型约束

泛型约束可以通过接口 + extends 来实现约束

// 会报错,T上没有length属性
function fn<T>(arg: T): T {
  console.log(arg.length);
  return arg;
}
// 定义一个带有属性的接口
interface Len{
  length : number;
}
// 对函数进行泛型约束
function fn<T extends Len>(arg: T): T {
  console.log(arg.length);
  return arg;
}

类与接口

// 定义一个操作数据库的泛型接口
interface Db<T> {
    insert(data: T): boolean;
    delete(data: T, id: number): boolean;
    update(data: T,id: number): boolean;
    select(data: T,id: number): any[];
}
// 泛型类实现这个数据库接口
class Sql<T> implements Db<T> {
    insert(data: T): boolean {
        console.log(data);
        return true;
    };
    delete(data: T, id: number): boolean {
        return true;
    };
    update(data: T, id: number): boolean {
        return true;
    };
    select(data: T, id: number): any[] {
        return [1,2,3];
    };
}
// 这个过程中接口和类的作用相同
class User{
    userName:string;
    userPwd:string;
}
interface User1{
    userName:string;
    userPwd:string;
}

let mySql = new Sql<User>();
mySql.insert({
    userName:'admin',
    userPwd:'123456'
});