[TypeScript] - TypeScript官方文档学习笔记-接口-下（四）

野性酷女 2023-02-23 07:46 11阅读 0赞

## Class类型 ##

### 实现接口 ###

像`Java`那样使用接口。但`TS`变量和方法都可以定义。

interface ClockInterface {
        currentTime: Date;
        setTime(d: Date): void;
    }
    
    class Clock implements ClockInterface {
        currentTime: Date = new Date();
        setTime(d: Date) {
            this.currentTime = d;
        }
        constructor(h: number, m: number) { }
    }

> 接口只可以定义`public`方法，不可以定义私有方法

### 类静态部分与实例部分的区别 ###

当你操作类和接口的时候，你要知道类是具有两个类型的：静态部分的类型和实例的类型。 你会注意到，当你用构造器签名去定义一个接口并试图定义一个类去实现这个接口时会得到一个错误：

interface ClockConstructor {
        new (hour: number, minute: number);
    }
    
    class Clock implements ClockConstructor {
        currentTime: Date;
        constructor(h: number, m: number) { }
    }

这里因为当一个类实现了一个接口时，只对其实例部分进行类型检查。 constructor存在于类的静态部分，所以不在检查的范围内。

因此，我们应该直接操作类的静态部分。 看下面的例子，我们定义了两个接口， `ClockConstructor`为构造函数所用和`ClockInterface`为实例方法所用。 为了方便我们定义一个构造函数 `createClock`，它用传入的类型创建实例。

interface ClockConstructor {
        new (hour: number, minute: number): ClockInterface;
    }
    interface ClockInterface {
        tick();
    }
    
    function createClock(ctor: ClockConstructor, hour: number, minute: number): ClockInterface {
        return new ctor(hour, minute);
    }
    
    class DigitalClock implements ClockInterface {
        constructor(h: number, m: number) { }
        tick() {
            console.log("beep beep");
        }
    }
    class AnalogClock implements ClockInterface {
        constructor(h: number, m: number) { }
        tick() {
            console.log("tick tock");
        }
    }
    
    let digital = createClock(DigitalClock, 12, 17);
    let analog = createClock(AnalogClock, 7, 32);

因为`createClock`的第一个参数是`ClockConstructor`类型，在`createClock(AnalogClock, 7, 32)`里，会检查`AnalogClock`是否符合构造函数签名。

另外一种简单的方法是使用类表达式

interface ClockConstructor {
      new (hour: number, minute: number);
    }
    
    interface ClockInterface {
      tick();
    }
    
    const Clock: ClockConstructor = class Clock implements ClockInterface {
      constructor(h: number, m: number) {}
      tick() {
        console.log("beep beep");
      }
    };

## 继承接口 ##

interface Shape {
        color: string;
    }
    
    interface Square extends Shape {
        sideLength: number;
    }
    
    let square = {} as Square;
    square.color = "blue";
    square.sideLength = 10;

多继承

interface Shape {
        color: string;
    }
    
    interface PenStroke {
        penWidth: number;
    }
    
    interface Square extends Shape, PenStroke {
        sideLength: number;
    }
    
    let square = {} as Square;
    square.color = "blue";
    square.sideLength = 10;
    square.penWidth = 5.0;

## 混合类型 ##

一个对象可以同时做为函数和对象使用，并带有额外的属性。

interface Counter {
        (start: number): string;
        interval: number;
        reset(): void;
      }
      
      function getCounter(): Counter {
        let counter = function (start: number) {} as Counter;
        counter.interval = 123;
        counter.reset = function () {};
        return counter;
      }
      
      let c = getCounter();
      c(10);
      c.reset();
      c.interval = 5.0;

## 接口 继承 类 ##

当接口继承了一个类类型时，它会继承类的成员但不包括其实现。 就好像接口声明了所有类中存在的成员，但并没有提供具体实现一样。 接口同样会继承到类的private和protected成员。 这意味着当你创建了一个接口继承了一个拥有私有或受保护的成员的类时，这个接口类型只能被这个类或其子类所实现（implement）。

当你有一个庞大的继承结构时这很有用，但要指出的是你的代码只在子类拥有特定属性时起作用。 这个子类除了继承至基类外与基类没有任何关系。 例：

class Control {
        private state: any;
    }
    
    interface SelectableControl extends Control {
        select(): void;
    }
    
    class Button extends Control implements SelectableControl {
        select() { }
    }
    
    class TextBox extends Control {
        select() { }
    }
    
    class ImageControl implements SelectableControl {
    // 类'ImageControl'错误地实现了接口'SelectableControl'。
    //类型有单独的私有属性'state'的声明。
        private state: any;
        select() { }
    }

在上面的例子中，SelectableControl包含了Control的所有成员，包括私有的state属性。由于state是一个私有成员，所以只有Control的子类才有可能实现SelectableControl，这是因为只有Control的子类才会有一个源自同一个声明的state私有成员，这也是Control的要求。这是因为只有Control的子类才会有一个源自同一个声明的state私有成员，这是私有成员兼容的要求。

在Control类中，可以通过SelectableControl的实例来访问状态私有成员。实际上，一个SelectableControl的作用就像一个已知有选择方法的Control。Button和TextBox类是SelectableControl的子类型（因为它们都继承自Control并有一个选择方法）。ImageControl类有它自己的状态私有成员，而不是扩展Control，所以它不能实现SelectableControl。