类实现接口
类使用implements可以实现接口,并可以多实现。类实现接口后,类体中必须实现接口所有字段和方法,当然类也可以扩展自己的成员。
下列门是一个类,防盗门是门的子类。如果防盗门有一个报警器的功能,可以简单的给防盗门添加一个报警方法。这时候如果有另一个类,车,也有报警器的功能,就可以考虑把报警器提取出来,作为一个接口,防盗门和车都去实现它:
interface Alarm {
alert(): void;
}
class Door {
}
class SecurityDoor extends Door implements Alarm {
alert() {
console.log('SecurityDoor alert');
}
}
class Car implements Alarm {
alert() {
console.log('Car alert');
}
}
类实现多个接口
一个类可以实现多个接口:用逗号隔开
interface Alarm {
alert(): void;
}
interface Light {
lightOn(): void;
lightOff(): void;
}
class Car implements Alarm, Light {
alert() {
console.log('Car alert');
}
lightOn() {
console.log('Car light on');
}
lightOff() {
console.log('Car light off');
}
}
上例中,Car 实现了 Alarm 和 Light 接口,既能报警,也能开关车灯。
类可以继承父类的同时实现接口
interface IShape {
draw():void;
size:number;
}
interface IName {
name: string;
}
class Shape {
public showArea():void {
console.log("面积是平方")
}
}
class Circle extends Shape implements IShape, IName {
public size:number = 30;
public name:string = "圆";
public draw():void {
console.log("会绘制一个"+this.name);
}
public show() {
console.log("本来是Circle");
}
}
let c:Circle = new Circle();
c.draw();
c.size = 31;
c.name = "四边型";
c.showArea();
c.show();
接口继承接口
接口与接口之间可以是继承关系:同时接口也可以继承多个接口,用逗号隔开
interface Alarm {
alert(): void;
}
interface LightableAlarm extends Alarm {
lightOn(): void;
lightOff(): void;
}
LightableAlarm 继承了 Alarm,除了拥有 alert 方法之外,还拥有两个新方法 lightOn 和 lightOff。
接口继承类
接口是不能继承类的,但是在 TypeScript 中却是可以的:接口可以继承类中的实例属性和实例方法
class Point {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}
interface Point3d extends Point {
z: number;
}
let point3d: Point3d = {x: 1, y: 2, z: 3};
TypeScript 会支持接口继承类的原因是,当在声明 class Point 时,除了会创建一个名为 Point 的类之外,同时也创建了一个名为 Point 的类型(实例的类型)。
所以我们既可以将 Point 当做一个类来用(使用 new Point 创建它的实例):
class Point {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}
const p = new Point(1, 2);
也可以将 Point 当做一个类型来用(使用 : Point 表示参数的类型):
class Point {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}
function printPoint(p: Point) {
console.log(p.x, p.y);
}
printPoint(new Point(1, 2));
实际上,上面的代码等价于:
class Point {
x: number;
y: number;
constructor(x: number, y: number) {
this.x = x;
this.y = y;
}
}
interface PointInstanceType {
x: number;
y: number;
}
function printPoint(p: PointInstanceType) {
console.log(p.x, p.y);
}
printPoint(new Point(1, 2));
上例中新声明的 PointInstanceType 类型,与声明 class Point 时创建的 Point 类型是等价的。