[TypeScript]接口interface详解

接口初探

TypeScript 的核心原则之一是对值所具有的结构进行类型检查。我们使用接口（Interfaces）来定义对象的类型。接口是对象的状态(属性)和行为(方法)的抽象(描述)

// readonly 修饰属性为只读
// ? 这个属性(可选)可有可无
interface IPerson {
  readonly id: number
  name: string
  age: number
  sex?: string
}

• readonly 修饰属性为只读,一旦赋值后再也不能被改变了
• ? 这个属性(可选),可有可无

readonly vs const

最简单判断该用 readonly 还是 const 的方法是看要把它做为变量使用还是做为一个属性。 做为变量使用的话用 const，若做为属性则使用 readonly

函数类型

为了使用接口表示函数类型，我们需要给接口定义一个调用签名。它就像是一个只有参数列表和返回值类型的函数定义。参数列表里的每个参数都需要名字和类型。

/* 
接口可以描述函数类型(参数的类型与返回的类型)
*/

interface SearchFunc {
  (source: string, subString: string): boolean
}
const mySearch: SearchFunc = function (source: string, sub: string): boolean {
  return source.search(sub) > -1
}

console.log(mySearch('abcd', 'bc')) // 1

类类型

• 类实现接口

  与 C# 或 Java 里接口的基本作用一样，TypeScript 也能够用它来明确的强制一个类去符合某种契约。

  /* 
  类类型: 实现接口
  1. 一个类可以实现多个接口
  */
  
  interface Alarm {
    alert(): any;
  }
  class Car implements Alarm {
    alert() {
        console.log('Car alert');
    }
  }
  

• 类可以实现多个接口

  /* 
  类类型: 实现接口
  2. 一个接口可以继承多个接口
  */
  
  interface Alarm {
    alert(): any;
  }
  
  interface Light {
    lightOn(): void;
    lightOff(): void;
  }	
  class Car2 implements Alarm, Light {
    alert() {
      console.log('Car alert');
    }
    lightOn() {
      console.log('Car light on');
    }
    lightOff() {
      console.log('Car light off');
    }
  }
  

• 接口继承(多)接口

  和类一样，接口也可以相互继承。 这让我们能够从一个接口里复制成员到另一个接口里，可以更灵活地将接口分割到可重用的模块里。

  interface LightableAlarm extends Alarm, Light {
  
  }
  

微信扫一扫,免费保护车主号码隐私的挪车码即可到手免费使用