typescript - 在空对象上使用所需的属性

Question

我经常遇到这种情况，而且我通常会以一种感觉不对的方式来处理它。我希望最终弄清楚如何正确地做到这一点。我将在使用它们之前声明变量，但它们保证有值，即使它们最初没有在构造函数中设置或设置。也许它的组织方式实际上是问题所在，我不确定，但打开它们感觉不正确。

interface Buttons {
  leftButton: HTMLElement
}

const buttons: Buttons = {}

window.addEventListener("load", load)

function load() {
  var el = document.getElementById("left-button")
  if (!el) throw new Error()
  buttons.leftButton = el

  buttons.leftButton.addEventListener("click", () => {})
}

我可以将其设为可选，但每次使用该属性时我都必须打开包装。

我在类中遇到了类似的情况，如果我没有在构造函数中设置属性，我必须解包它，这感觉比前面的例子好一点，因为它是描述性的并且明确地说“我知道这不是设置在构造函数，但它不为空”

class Helper {

  el!: HTMLElement

  constructor() {
    this.setElements()
  }

  private setElements() {
    this.el = document.getElementById("id")!
  }
}

感谢您的阅读，非常感谢您的帮助！

标签： typescript