typescript（五）--- typescript中的接口

接口的作用就是为这些类型命名和为你的代码或第三方代码定义规矩，达成一致

• 在说接口之前我们需要了解下 TypeScript 里的类型，因为在接口的使用和类型密不可分。

接口关键词 interface 定义一个接口。

interface Home {
    
     // 定义接口,规定类型
    name: string,
    age: number,
}

let options: Home = {
    
     // 使用接口
    name: '小弥',
    age: 20,
}

console.log(options.name); // 小弥

接口里的属性

• readonly （只读，不能做出修改 有点像es6的const）

interface Home {
    
    
    readonly name: string,
    age: number,
}

let options: Home = {
    
    
    name: '小弥',
    age: 20,
}

options.name = '小红'; // 这里会报错，因为name属性设置了readonly是不可以做修改的

可选值

有时候我们不一定要设置对象里的某个属性，接口里可以用 “?” 来表示一个属性是否是可选的。

interface Home {
    
    
    readonly name: string,
    age?: number, // 不加“？”会报错，ts默认是必须都传
}

let options: Home = {
    
    
    name: '小弥',
}

console.log(options.name); // 小弥

描述属性（可以控制接口里属性规定的写法）

interface Rect {
    
    
    height: number;
    width: number;
    [propName: string]: number // 意思是"propName"必须是string类型
}

函数接口 （可以通过接口来对函数做“规定”）

interface Home {
    
    
    (name:string,age:number):any;
}

let run: Home = function (name: string, age: number): string {
    
    
    return `我的名字叫${
      
      name}，今年已经${
      
      age}岁啦~`;
}

console.log(run('小弥', 20));

接口的继承 （关键词 extends ）

interface Home {
    
    
    name: string,
    age?: number
}

interface Mint extends Home {
    
    
    data?: Array<string>,
}

let obj: Mint = {
    
    
    name: '小弥'
}

console.log(obj);

Ts中涉及到继承的都用 extends