Typescript 中的接口定义，属性类型接口，函数类型接口，可索引接口，类类型接口

ゞ浴缸里的玫瑰 2022-10-25 04:39 199阅读 0赞

// ts中的接口: 对批量方法传入参数进行约束，

// 接口：行为和动作的规范，对批量方法进行约束

// 基本接口
    interface FullName{ 
      firstName: string;
      secondName: string;
    }
    function printName(name: FullName) {
      // 必须传入对象 firstName, secondName
      console.log(name.firstName+'---'+name.secondName);
    }
    //  调用方法：如果参数单独定义，可以写上多余的参数，如下
    var obj = {age:99,firstName:"张",secondName:"易得"}
    printName(obj);
    // 如果是直接写在方法里，所写的参数必须和接口的参数一致
    printName({ firstName: '刘', secondName: "邦" });

属性类型接口：可选属性; 就是在接口中的属性后面加问号；这样，调用方法的时候，加问号的参数可以不用传

interface FullName { 
      firstName: string;
      secondName?: string;
    }
    function getName(name: FullName) { 
      console.log(name); 
    }
    getName({firstName:"赵明诚"});

// 函数类型接口：对方法传入的参数，以及返回值进行约束

interface encrypt { 
      (key: string, value: string): string;
    }
    var md5: encrypt = function (key: string, value: string): string { 
      return `${key}===${value}`
    }
    console.log(md5('name','张三'))

// 可索引接口：对数组，对象的约束

// 可索引接口：对数组，对象的约束
    interface UserArr { 
      [index: number]: string;
    }
    var arra: UserArr = ["1", "8", "9"];
    console.log(arra);
    interface Person { 
      [index: string]: string;
    }
    var u: Person = { name: "张三", age: "565" }
    console.log(u);

// 类类型接口：对类的约束，和抽象类类似

// 类类型接口：对类的约束，和抽象类类似
    interface Animal { 
      name: string;
      eat(foot: string): void;
    }
    class Tiger implements Animal { 
      name: string;
      constructor(name: string) {
        this.name = name;
      }
      eat(foot: string):void { 
        console.log(`${this.name}在吃${foot}`);
      }
    }
    var t = new Tiger("老虎")
    t.eat("鲜肉")