Interface 接口初步了解

现在我们要作一个简历的自动筛选程序,很简单。年龄小于 25 岁,胸围大于 90 公分的,可以进入面试环节。我们最开始的写法是这样的。(新建一个文件 Demo8.ts,然后编写如下代码)

  1. const screenResume = (name: string, age: number, bust: number) => {
  2. age < 24 && bust >= 90 && console.log(name + "进入面试");
  3. age > 24 || (bust < 90 && console.log(name + "你被淘汰"));
  4. };
  5. screenResume("大脚", 18, 94);

写好后,好像我们的程序写的不错,可以在终端中使用ts-node demo8.ts进行查看。这时候老板又增加了需求,说我必须能看到这些女孩的简历。于是你又写了这样一个方法。

  1. const getResume = (name: string, age: number, bust: number) => {
  2. console.log(name + "年龄是:" + age);
  3. console.log(name + "胸围是:" + bust);
  4. };
  5. getResume("大脚", 18, 94);

这时候问题来了,程序开发中一直强调“代码重用”,两个方法用的类型注解一样,需要作个统一的约束。大上节课我们学了一个类型别名的知识可以解决代码重复的问题,这节课我们就学习一个更常用的语法接口(Interface).
我们可以把这两个重复的类型注解,定义成统一的接口。代码如下:

  1. interface Girl {
  2. name: string;
  3. age: number;
  4. bust: number;
  5. }

有了接口后,我们的程序也要作一些修改,需要写成下面的样子。这样就更像是面向对象编程了。

  1. const screenResume = (girl: Girl) => {
  2. girl.age < 24 && girl.bust >= 90 && console.log(girl.name + "进入面试");
  3. girl.age > 24 || (girl.bust < 90 && console.log(girl.name + "你被淘汰"));
  4. };
  5. const getResume = (girl: Girl) => {
  6. console.log(girl.name + "年龄是:" + girl.age);
  7. console.log(girl.name + "胸围是:" + girl.bust);
  8. };
  9. const girl = {
  10. name: "大脚",
  11. age: 18,
  12. bust: 94,
  13. };
  14. screenResume(girl);
  15. getResume(girl);

接口和类型别名的区别

现在我们学了接口,也学过了类型别名,这两个语法和用处好像一样,我先表个态,确实用起来基本一样,但是也有少许的不同。

类型别名可以直接给类型,比如string,而接口必须代表对象。

比如我们的类型别名可以写出下面的代码:

  1. type Girl1 = stirng;

但是接口就不能这样写,它必须代表的是一个对象,也就是说,你初始化girl的时候,必须写出下面的形式.

  1. const girl = {
  2. name: "大脚",
  3. age: 18,
  4. bust: 94,
  5. };

接口非必选值得定义

这节课我们多学一点,因为接口这里的知识点还是挺多的。比如这时候老板又有了新的要求,要求尽量能看到小姐姐的腰围,但是不作强制要求,就是可选值吗。那接口如何定义那?其实typeScript已经为我们准备好了相应的办法,就是在:号前加一个?

比如把Girl的接口写成这样。

  1. interface Girl {
  2. name: string;
  3. age: number;
  4. bust: number;
  5. waistline?: number;
  6. }

然后我们再修改一下getResume方法,写成这样。

  1. const getResume = (girl: Girl) => {
  2. console.log(girl.name + "年龄是:" + girl.age);
  3. console.log(girl.name + "胸围是:" + girl.bust);
  4. girl.waistline && console.log(girl.name + "腰围是:" + girl.waistline);
  5. };

这时候在定义girl对象的时候,就可以写saistline(腰围),也可以不写了。

applicant
auditTime
auditor
woStatus
appTime
applyDesc