#typescript学习系列# 接口

• 接口一方面可以在面向对象编程中表示为行为的抽象，另外可以用来描述对象的形状
• 接口就是把一些类中共有的属性和方法抽象出来,可以用来约束实现此接口的类
• 一个类可以继承另一个类并实现多个接口
• 接口像插件一样是用来增强类的，而抽象类是具体类的抽象概念
• 一个类可以实现多个接口，一个接口也可以被多个类实现，但一个类的可以有多个子类，但只能有一个父类

1.对象的形状

interface Speakable {
//   speak(): void; //或者下面的写法
  speak:()=>void;
  name: string;
}

let speakman: Speakable = {
  speak: () => {},
  name: "fung"
};

let aaa: Speakable = {
  name: "fung",
  speak: () => {
    console.log("汉语");
  }
};

2.行为的抽象

interface Speakable {
  speak: () => void;
}

interface Eatable {
  eat: () => void;
}

class Person1 implements Speakable, Eatable {
  speak(){
      console.log('chinese');
  }
  eat(){
      console.log('beaf');
  }
 //也可以这么写
//   speak = () => {
//     console.log("chinese");
//   };
//   eat = () => {
//     console.log("beaf");
//   };
}

3.任意属性

//无法预先知道有哪些新的属性的时候,可以使用 `[propName:string]:any`,propName名字是任意的
  interface Person {
    readonly id: number;
    name: string;
    [propName: string]: any;
  }

  let p2: Person = {
    id: 1,
    name: "fung",
    age: 18
  };

4.接口的继承

interface Speakable {
        speak(): void
    }
    interface SpeakChinese extends Speakable{
        speakChinese():void
    }

    class Person implements Speakable, Speakable{
        speak(){
            console.log('Person')
        }
        speakChinese(){
            console.log('chinese')
        }
    }
    let p = new Person();
    p.speak();
    p.speakChinese();

5.用 readonly 定义只读属性可以避免由于多人协作或者项目较为复杂等因素造成对象的值被重写

interface Person {
    readonly id: number;
    name: string;
  }
  let tom: Person = {
    id: 1,
    name: "zhufeng"
  };
  tom.id = 1; //ERROW

6.函数类型接口
对函数传入的参数和返回值进行约束

interface add {
    (a: number, b: number): number;
  }
  let add: add = function(a, b) {
    return a + b;
  };

7.可索引接口

• 对数组和对象进行约束
• userInterface 表示index的类型是 number，那么值的类型必须是 string
• UserInterface2 表示：index的类型是 string，那么值的类型必须是 string

interface userInterface {
    [index: number]: string;
  }
  let arr: userInterface = ["a", "b"];

  interface UserInterface2 {
    [index: string]: string;
  }
  let obj: UserInterface2 = { name: "fung" };

8.类接口
对类的约束

interface Person {
    name: string;
    speak():void;
  }
  class Person implements Person {
    name: string;
    constructor(name: string) {
      this.name = name;
    }
    speak(){
      console.log("chinese");
    }
  }
  //或者这么写
  interface PersonImp {
    name: string;
    speak: () => void;
  }
  class Person implements PersonImp {
    name: string;
    constructor(name: string) {
      this.name = name;
    }
    speak = () => {
      console.log("chinese");
    };
  }

9.构造函数的类型

• 在 TypeScript 中，我们可以用 interface 来描述类
• 同时也可以使用interface里特殊的new()关键字来描述类的构造函数类型

class Animal {
    constructor(public name: string) {}
  }
  interface WithNameClass {
    new (name: string): Animal;
  }
  function createAnimal(clazz: WithNameClass, name: string) {
    return new clazz(name);
  }
  let a = createAnimal(Animal, "fung");
  console.log(a.name);