使用"开放接口"在TypeScript中扩展HTMLElement

Question

我想用其他方法扩展内置类HTMLElement.也许我会发疯,但我认为以下是官方成语:

interface HTMLElement {
   swapChildBefore(remove: HTMLElement, insert: HTMLElement, before: HTMLElement): void;
}

HTMLElement.prototype.swapChildBefore =
   function (remove: HTMLElement, insert: HTMLElement, before: HTMLElement): void {
      this.removeChild(remove)
      this.insertBefore(insert, before)
   }

至少,根据原型如何扩展打字稿？,这样的事情应该有效.

但是,这似乎隐藏了HTMLElement上的所有现有方法.那是因为我已经声明了一个接口,它隐藏了同名的类吗？但是这个成语似乎与Object和Array一起使用,它们也是类.

Answer 1

扩展接口必须在代码的根级别完成.如果您尝试扩展模块内部的接口,则该模块内部的代码只会看到该范围内的接口.

破碎的例子:

interface ExpandableInterface {
    memberOfFIRSTDefinition: number;
}

module MyModule {
    interface ExpandableInterface {
        memberOfSECONDDefinition: number;
    }

    class MyClass {
        constructor() {
            var m: ExpandableInterface = {};
            m.memberOfFIRSTDefinition; // <-- It can't see this member because it's only scoped to the one inside of the module.
        }
    }
}

工作范例:

interface ExpandableInterface {
    memberOfFIRSTDefinition: number;
}

interface ExpandableInterface {
    memberOfSECONDDefinition: number;
}

module MyModule {
    class MyClass {
        constructor() {
            var m: ExpandableInterface = {};
            m.memberOfFIRSTDefinition; // <-- They're both root level, it can be seen :)
        }
    }
}