通过在字段数组中添加新元素来扩展 TypeScript 类型

Question

我想告诉 TS，类型与它所期望的一样，只需要稍微改变一下添加字段。诀窍是，我不需要将字段添加到类型本身，而是添加到其字段集合中的可用元素集。

这可行，但冗长且笨拙。

const explicit = this.element.nativeElement.attributes.banana;

我可以提高可读性。

const pre = this.element.nativeElement;
const implicit = pre.attributes.banana;

其实我已经有这样的领域了。然而，出于其他考虑，它的输入如下，导致它因输入错误而对我咆哮。

const typed = this.element.nativeElement as HTMLElement;
const boohoo = typed.attributes.banana;

当然，我可以作弊。但编写 TS 并使用

any

就像拿到手电筒并使其由太阳能驱动。

const typed = this.element.nativeElement as HTMLElement;
const weehee = (typed.attributes as any).banana;

这就是为什么我想说，嘿 TS，让我们添加一个像

as HTMLElement & { banana: string }

这样的新字段，但这样香蕉就成为属性的一部分，而不是元素本身。

const retyped = this.element.nativeElement as HTMLElement & { ??? };

我不知道如何做到这一点，并且我尝试过查看我能找到的所有示例。我知道这是可能的，因为它出奇地连贯。除了显式声明新类型之外，我看不出如何实现。而且没有作弊。

Answer 1

我不确定你想通过这样做实现什么，但我想这就是你想要的：

interface CustomNamedNodeMap extends NamedNodeMap {
  banana: string;
}

interface CustomHTMLElement extends HTMLElement {
  attributes: CustomNamedNodeMap;
}

(this.element.nativeElement as CustomHTMLElement).attributes.banana;