TypeScript/TS入门学习4

不减20斤不改头像
65 阅读2分钟

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第3天，点击查看活动详情

泛型接口

意义和能力

  1. 将泛型和接口合起来使用，可以大大简化我们的代码，增加我们代码的可读性。
  2. 泛型也可以使用默认值

泛型接口使用

使用接口定义一个IPerson接口，感觉没什么问题，只是在其他特殊场景下使用接口泛型更合理。这里只是举例说明一下而已

interface IPerson {
    name: string;
    age: number;
}

let p: IPerson = {
    name: "tom",
    age: 19
}

使用接口泛型定义一个IPerson,使用接口泛型有两个特点，特点1是接口中使用泛型当作参数，然后里面将传入的泛型约束指定的属性，特点2是要满足这接口的实力必须传入需要的泛型参数，并且里面的属性和泛型中约束的类型必须一致，比如这个例子，如果不小心把name改成19，age改成'tom',都是会报错的

image.png

interface IPerson<T1, T2> {
    name: T1;
    age: T2;
}


let p: IPerson<string, number> = {
    name: "tom",
    age: 19
}

泛型默认值使用

当然接口使用起来传两个类型是很麻烦的，那又想使用泛型接口，又不想每次都传类型参数是不是有办法做到呢？当然可以，泛型默认值就是为了解决大多数满足泛型的情况下，省了用户传入泛型


interface IPerson<T1=string, T2=number> {
    name: T1;
    age: T2;
}


let p: IPerson= {
    name: "tom",
    age: 19
}

泛型的默认值是类型。如果是具体某个数字，那它就是字面量类型，而不会自动扩展成number类型，也就是number和18不是可替代的关系，number表示所有数值类型，而18就是18这个值的类型，因此，下面这段代码编译会报错。


interface IPerson<T1 = string, T2 = 18> {
    name: T1;
    age: T2;
}


let p: IPerson = {
    name: "tom",
    age: 19
}

image.png

泛型接口一般是解决未知的类型的问题，只有在用户操作时才能确定类型，所以使用意义很大，一般的前后端交互，会用到泛型接口，因为类型由使用时约束更方便。

avatar
文章
阅读
粉丝