readonly properties can be modified from outside the class

[DiogoSoaress]

TypeScript Version: 4.0.2

Search Terms:
readonly class
Expected behavior:
readonly properties cannot be modified from outside the class

Actual behavior:
readonly properties can actually be modified from outside the class

Related Issues:
No. This bug was found in the Typescript Handbook

Code

// @errors: 2540
class Octopus {
  readonly name: string;
  readonly numberOfLegs: number = 8;

  constructor(theName: string) {
    this.name = theName;
  }
}

let dad = new Octopus("Man with the 8 strong legs");
dad.name = "Man with the 3-piece suit";

console.log(dad)

Output

"use strict";
// @errors: 2540
class Octopus {
    constructor(theName) {
        this.numberOfLegs = 8;
        this.name = theName;
    }
}
let dad = new Octopus("Man with the 8 strong legs");
dad.name = "Man with the 3-piece suit";
console.log(dad);

Compiler Options

{
  "compilerOptions": {
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "strictPropertyInitialization": true,
    "strictBindCallApply": true,
    "noImplicitThis": true,
    "noImplicitReturns": true,
    "alwaysStrict": true,
    "esModuleInterop": true,
    "declaration": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "moduleResolution": 2,
    "target": "ES2017",
    "jsx": "React",
    "module": "ESNext"
  }
}

Playground Link: Provided

[RyanCavanaugh]

What is the implied defect here? This is flagged as an error

[DiogoSoaress]

It flags the error but still console logs the changed property. Is that the expected behaviour? If so pardon my interpretation.

[RyanCavanaugh]

Yes, TypeScript's type system is erased. It doesn't change the runtime behavior of JS.