TS - typescript 接口(interface)

接口

TypeScript 的核心原则之一是对值所具有的结构进行类型检查。我们使用接口(Interfaces)来定义对象的类型。

接口是对象的状态(属性)和行为(方法)的抽象(描述)

接口类型的对象: 多了或者少了属性是不允许的
可选属性: ?
只读属性: readonly

// 定义人的接口
interface IPerson {
  readonly id: number	// 只读属性:一旦赋值后再也不能被改变了。
  name?: string			// 可选属性
  age: number
  sex: string
}

const person1: IPerson = {
  id: 1,
  name: 'tom',
  age: 20,
  sex: '男'
}
const person2: IPerson = {
  id: 2,
  // name: 'jilyz',
  age: 18,
  sex: '男'
}
// person1.id = 3	// error

可选属性的好处:

  • 对可能存在的属性进行预定义;
  • 捕获引用了不存在的属性时的错误.

函数类型

接口能够描述 JavaScript 中对象拥有的各种各样的外形。 除了描述带有属性的普通对象外,接口也可以描述函数类型

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

interface SearchFunc {
    // 定义一个调用签名: 像是一个只有参数列表和返回值类型的函数定义
    (source: string, subString: string): boolean
}
// 创建一个函数类型的变量,并将一个同类型的函数赋值给这个变量。
const mySearch: SearchFunc = function (source: string, sub: string): boolean {
    return source.search(sub) > -1  // search 返回子串的索引
}
console.log(mySearch('abcd', 'bc')) // true

类类型

类实现接口。

  1. 一个类可以实现多个接口
  2. 一个接口可以继承多个接口
interface Alarm {
    alert(): any;
}

interface Light {
    lightOn(): void;
    lightOff(): void;
}

class Car implements Alarm {
    alert() {
        console.log('Car alert');
        return `I'm car alert`
    }
}
class Car2 implements Alarm, Light {
    alert() {
        console.log('Car alert');
    }
    lightOn() {
        console.log('Car light on');
    }
    lightOff() {
        console.log('Car light off');
    }
}
// let c1 = new Car()
console.log(new Car().alert());
console.log(new Car2().alert());
new Car2().lightOff()
// 接口继承接口:从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。
interface LightableAlarm extends Alarm, Light { }
class Lta implements LightableAlarm{    // 必须实现接口所有方法
    alert(){}   
    lightOff(){}
    lightOn(){}
}

你可能感兴趣的:(Typescript,typescript,ts,接口,interface)