在接口和/或类中强制执行只读

Question

I'm working on a class that I'm using as a Model, and I want to make sure that the data is readonly. It's simple enough on its own, but it seems to get tricky when the data is nested. Let me give and example of my code to make this more clear:

export class MyModel {
  readonly One: IOne;
  readonly Two: ITwo;
  readonly Three: IThree;

  constructor() {
    this.One.A = "foo";
    this.One.B = "bar";
    this.Two.C = "totally";
    this.Two.D = "utterly";
    this.Three.E = "completely";
    this.Three.F = "messed up"
  }
}

interface IOne {
  A: string;
  B: string;
}

interface ITwo {
  C: string;
  D: string;
}

interface IThree {
  E: string;
  F: string;
}

Then in a component:

import { MyModel } from './my.model';

export MyComponent {
  
  dataB:string;
  dataD:string;
  dataE:string;

  constructor(
    private mymodel: MyModel
  ){
    this.dataB = mymodel.One.B; // works as expected
    mymodel.Two = ""; // gives error since it is readonly, as expected
    mymodel.Three.F = "something else"; // works, but I want this to be readonly as well
  }

}

The idea is that I can keep my data in places where they make the most sense but also allow my IDE to give hints of what is available as I type mymodel.One.B. But, I need to have the properties (not sure I'm using the right term here) from the Interfaces to also be readonly.

If I add readonly to the Interfaces, I of course get an error in MyModel because I cannot set the values of something that is readonly. To get around this, I tried creating other classes that implement those Interfaces, set readonly in the classes, then use the classes instead of the interfaces, it does not give the error, but they are still not prevented from assigning values in MyComponent. Example:

export class MyModel {
  readonly One: One;
  readonly Two: Two;
  readonly Three: Three;

  constructor() {}
}

class One implements IOne {
  readonly A = "foo";
  readonly B = "bar";
}

class Two implements ITwo {
  readonly C = "totally";
  readonly D = "utterly";
}

class Three implements IThree {
  readonly E = "completely";
  readonly F = "messed up";
}

interface IOne {
  A: string;
  B: string;
}

interface ITwo {
  C: string;
  D: string;
}

interface IThree {
  E: string;
  F: string;
}

The result in MyComponent is the same. How do I enforce readonly for A, B, C, etc.?

Answer 1

I found the proper way to make this work.

I hadn't realized it, but the way I have MyModel written throws an error the moment MyComponent instantiates it because mymodel.A is undefined. The trick was to set values outside of the constructor, which also led me to the solution for my original question:

export class MyModel {
  readonly One: IOne = {
    A: "foo",
    B: "bar"
  }

  constructor(){}
}

interface IOne {
  readonly A: string,
  readonly B: string
}

This produced the proper error when trying to assign a value to mymodel.One.A in MyComponent.