继承静态类遇Uncaught TypeError：如何实现静态属性独立？

错误原因分析 #

你遇到的Uncaught TypeError: Super expression must either be null or a function，核心问题是用实例调用了静态方法，同时子类未独立声明静态成员导致预期的隔离效果失效：

• 静态方法（initialize、showVal）属于类本身，而非类的实例，用实例调用会导致this指向混乱，触发继承相关的运行时错误。
• 子类未重新声明static val，会共享父类Base的静态val，无法实现各自独立的值存储。

修正后的代码 #

class Base{
    static val;
    static initialize(x){
        this.val = x;
    }
}
class Main1 extends Base{
    static val; // 子类独立声明静态val，避免共享父类的val
    static showVal(){
        return this.val;
    }
}

class Main2 extends Base{
    static val; // 子类独立声明静态val
    static showVal(){
        return this.val * 2
    }
}

// 通过类本身调用静态方法，而非实例
Main1.initialize(1);
Main2.initialize(2);

// 通过类本身调用静态方法获取值
console.log(Main1.showVal());// 输出1
console.log(Main2.showVal());// 输出4

关键知识点说明 #

• 静态成员的归属：静态属性和方法属于类的构造函数本身，不是实例。必须通过类名.方法/属性的方式访问，不能用实例调用。
• 子类静态成员的隔离：如果子类需要独立的静态属性，必须在子类中重新声明static val，否则子类会继承父类的静态属性，多个子类会共享同一个值。
• 静态方法中的this：静态方法内的this指向调用该方法的类（比如Main1.initialize中this指向Main1类），而非实例，这样才能正确操作子类的静态属性。

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