typescritp中类与接口的关系

类实现接口

与C#或Java里接口的基本作用一样,TypeScript也能够用它来明确的强制一个类去符合某种契约。
注意
接口描述了类的公共部分,而不是公共和私有两部分
当用构造器签名去定义一个接口并试图定义一个类去实现这个接口时会得到一个错误,因为当一个类实现了一个接口时,只对其实例部分进行类型检查。 constructor存在于类的静态部分,所以不在检查的范围内

interface ClockInterface {
    currentTime: Date; 
    setTime(d: Date):void; // 在接口中描述一个方法,在类里实现它
   // new (hour: number, minute: number); // 构造函数定义一个接口会导致Clock会报错
}

class Clock implements ClockInterface {
    // private currentTime: Date = new Date(); // 报错,接口描述了类的公共部分,而不是公共和私有两部分
    currentTime: Date = new Date(); 
    constructor(h: number, m: number) { }
    setTime(d:Date){ this.currentTime = d; }
}

继承接口:

和类一样,接口也可以相互继承。 从一个接口里复制成员到另一个接口里,可以更灵活地将接口分割到可重用的模块里。
一个接口可以继承多个接口,创建出多个接口的合成接口。

interface Shape {  color: string; }

interface PenStroke { penWidth: number; }

// 继承多个接口用 逗号(",") 分开
interface Square extends Shape, PenStroke { sideLength: number; }

let square = <Square>{}; // <Square>{} 等价与 {} as Square; 跟断言一个道理
square.color = "blue";
square.sideLength = 10;
square.penWidth = 5.0;

接口继承类:

当接口继承了一个类时,
1.它会继承类的成员但不包括其实现,

class Control { private state: any; }

interface SelectableControl extends Control { 
    select(): void; 
    //此时不需要实现SelectableControl里面的state
}

2.接口同样会继承到类的private和protected成员。 这意味着当你创建了一个接口继承了一个拥有私有或受保护的成员的类时,这个接口类型只能被这个类或其子类所实现(implements )
通俗点数就是(SelectableControl 接口名称,Control类姓名):
如果接口”SelectableControl “继承了一个拥有private和protected成员的类”Control “,则”SelectableControl “只能被”Control “或”Control “的子类实现

比如下面的这个例子:

class Control { 
    state: any;
    // private state1: any; // 类“C”会报错(类“C”缺少类“SelectableControl”的以下属性:state1,state2)
    // protected state2: any
}

interface SelectableControl extends Control { 
    select(): void; 
     //此时不需要实现Control里面的state
}

// 当“Control”存在私有私有变量的时候,“B"是其子类,所以不会报错。
class B extends Control implements SelectableControl {  
    select() { }; 
    // “B”继承了“Control”,所以存在 state
}

class C implements SelectableControl { 
    state: any; // 类“SelectableControl”继承了“Control”的state,所以state必需的
    select() { } // 实现接口SelectableControl
}

class D extends Control { 
    setDisabled() { } 
}

猜你喜欢

转载自blog.csdn.net/l284969634/article/details/105141777