TypeScript中如何将readonly变量传入父类构造函数？

你遇到的问题是TypeScript的构造函数执行顺序限制：派生类构造函数中必须先调用super()，之后才能访问this，所以直接用this.READ_ONLY传参就会触发ts(17009)错误。以下是几种可行的解决方式：

方案1：使用静态readonly成员 #

把实例的readonly属性改为类的静态readonly成员，静态成员属于类本身，不依赖实例this，可以在super()调用前直接访问：

abstract class ChildClass extends ParentClass {
    private static readonly READ_ONLY: number = 1;

    public constructor(foo: string) {
        super(foo, ChildClass.READ_ONLY); 
    }
}

这种方式保持了值的只读特性，且不需要实例化就能访问，适合所有子类共用同一个固定值的场景。

方案2：提取为外部常量 #

如果需要同时保留实例的readonly成员，可把值提取到类外部的常量中，既用于super()传参，又用于初始化实例属性：

const READ_ONLY_CONSTANT = 1;

abstract class ChildClass extends ParentClass {
    private readonly READ_ONLY: number = READ_ONLY_CONSTANT;

    public constructor(foo: string) {
        super(foo, READ_ONLY_CONSTANT); 
    }
}

这种方式兼顾了实例属性和构造函数传参的需求，子类若要修改值，只需重新定义自己的常量即可。

方案3：构造函数传参（支持子类自定义值） #

如果需要子类能自定义这个readonly值，可以让抽象类的构造函数接收该值，同时初始化自身的readonly成员：

abstract class ChildClass extends ParentClass {
    private readonly READ_ONLY: number;

    public constructor(foo: string, readOnlyValue: number) {
        super(foo, readOnlyValue);
        this.READ_ONLY = readOnlyValue;
    }
}

// 子类实现示例
class GrandChild extends ChildClass {
    private static readonly CUSTOM_READ_ONLY = 2;
    constructor(foo: string) {
        super(foo, GrandChild.CUSTOM_READ_ONLY);
    }
}

这种方式让每个子类可以灵活设置自己的readonly值，同时保证抽象类的构造函数能把值传递给父类。

内容的提问来源于stack exchange，提问作者Héctor Iglesias