JavaScript中如何引用customElements.define内匿名类的静态变量

你可以直接通过this.constructor访问当前实例对应的类构造函数，该属性不受类是否匿名的影响，作用和你提到的Python中type(self)完全一致。

你代码里的对应行修改为以下写法即可正常获取静态属性：

shadowRoot.appendChild(document.importNode(this.constructor.template, true));

补充说明 #

• 静态属性本身支持类继承，如果你后续基于当前匿名类派生新的自定义元素，this.constructor会自动指向实际实例化的子类，比硬编码类名的写法灵活性更高。
• 不要混淆typeof this和this.constructor：前者返回的是表示实例类型的字符串"object"，自然无法访问静态属性；后者直接指向创建该实例的构造函数，可以直接读取挂载在构造函数上的所有静态成员。

完整的可运行代码如下：

window.customElements.define('my-uploader', class extends HTMLElement {
    static template = document.getElementById("TEMPLATE_UPLOADER");

    constructor() {
        super(); // 必须首先调用super()
    }

    /** 自定义组件生命周期钩子 **/
    connectedCallback() {
        let shadowRoot = this.attachShadow({mode: "open"});
        shadowRoot.appendChild(document.importNode(this.constructor.template, true));
    }
})

内容的提问来源于stack exchange，提问作者run_the_race