Typescript 是否在类构造函数中设置接口属性？答案

【问题标题】：Does Typescript set interface properties in the Class Constructor?Typescript 是否在类构造函数中设置接口属性？
【发布时间】：2019-05-30 22:00:23
【问题描述】：

在Typescript documentation on interfaces的“类类型”下，给出以下示例：

interface ClockInterface {
    currentTime: Date;
}

class Clock implements ClockInterface {
    currentTime: Date = new Date();
    constructor(h: number, m: number) { }
}

“class Clock...”下面以“currentTime:...”开头的行似乎暗示如果我执行var something = new Clock()，我的something 变量将可以访问currentTime 属性，即something.currentTime。

这让我很困惑，因为来自the MDN documentation on Javascript Classes 的以下行：

实例属性必须在类方法中定义

他们给出的例子：

class Rectangle {
  constructor(height, width) {    
    this.height = height;
    this.width = width;
  }
}

暗示以下代码将无效：

class Rectangle {
  height: 23, 
  width: 45,
  constructor(height, width) {    
  }
}

我的困惑：Typescript 文档中的示例代码没有在构造函数中分配 currentTime。他们的示例中是否缺少该步骤，或者他们的语法是否暗示“顺便说一句，直接在类上定义的属性在构造函数中被神奇地赋予了值？”如果是这种情况，如果您自己“手动”在构造函数中设置给定值会发生什么？

【问题讨论】：

Typescript 语法 !== JavaScript 语法。所以比较文档肯定会混淆。
我同意，但我想我可以改写“这个打字稿语法在 Javascript 术语中是什么意思”这个问题。你认为这是一个更好的问题吗？
当然 - 那么我会说当 Typescript 被转译回 JavaScript 时，JavaScript 构造函数被编写。甚至没有使用 JavaScript Class 关键字。如果是这样，转译后的 JavaScript 必须看起来与 MDN 中的示例完全相同。含义：在转译的 Typescript 中，currentTime 变量肯定是在构造函数中设置的。
TypeScript 通常tries to support ECMAScript 提案在第 3 阶段或之后。 Class field initialization 是 one such proposal 的一部分，它可能会在某一天进入 ES20XX。所以希望这最终将是有效的 JavaScript 语法（减去类型注释）。

标签： javascript typescript class

【解决方案1】：

class Clock implements ClockInterface {
    currentTime: Date = new Date();
    constructor(h: number, m: number) { }
}

运行构造函数，然后将分配默认值的所有属性连接起来，以便在调用构造函数后分配 currentTime。

这允许像这样的语法

class MyClass {
  myProperty = this.myService.serviceProperty;

  constructor(private myService: Myservice) {}
}

将构造函数参数标记为私有、受保护或公共自动将它们分配为类的属性，您不需要这样做

this.property = paramater

在构造函数中。 TypeScript 语法与 JavaScript 不同，但是一旦你习惯了它就很棒。

【讨论】：