【问题标题】:Unable to understand interfaces in typescript?无法理解打字稿中的接口?
【发布时间】:2020-03-08 04:11:21
【问题描述】:

我是打字稿的新手。我在打字稿的官方网站上看到了一个教程。

interface ClockConstructor {
    new (hour: number, minute: number): ClockInterface;
}
interface ClockInterface {
    tick(): void;
}

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);

我不明白是怎么回事

interface ClockConstructor {
    new (hour: number, minute: number): ClockInterface;
}

正在工作。

另外,这个类的函数名中的createClock(DigitalClock, 12, 17); 只是传递,没有传递任何对象。

请帮助我理解。

【问题讨论】:

  • “类名”实际上是一个构造函数。 createClock 调用它并返回创建的对象。
  • ClockConstructor是创建ClockInterface实例的构造函数的类型

标签: typescript oop interface typescript2.0


【解决方案1】:

接口是对其他对象的描述。

interface ClockConstructor {
    new (hour: number, minute: number): ClockInterface;
}

ClockConstructor 描述了一个可以使用new 运算符调用的可调用对象。 new 操作符可以调用什么样的对象?一类。请注意,我指的不是类实例,而是类本身。当我们想要键入一个可以包含可以通过使用特定参数调用它来构建的类的变量时,这样的接口很有用。

createClock(DigitalClock, 12, 17); 将特定的类DigitalClock 传递给一个参数,该参数必须是一个具有接受指定参数的构造函数的类。

【讨论】:

  • 所以在运行时它用新的 DigitalClock(hour:number,minute:number) 替换 new (hour:number,minute:number)
  • @DhirajKumar 在编译时,当您尝试将DigitalClock 传递给函数createClock 时,它会检查DigitalClock 是否具有带有参数(hour:number,minute:number) 的构造函数。在运行时ctor 将包含类DigitalClock(在第一次调用中)或AnalogClock(在第二次调用中),因此调用new ctor ... 将与分别调用new DigitalClock ...new AnalogClock ... 具有相同的效果。
猜你喜欢
  • 2016-09-14
  • 2021-02-04
  • 2021-02-06
  • 2023-02-07
  • 2017-09-02
  • 1970-01-01
  • 2021-04-27
  • 1970-01-01
  • 2019-12-12
相关资源
最近更新 更多