readonly fields

Learn to make class fields constant with readonly.

What is readonly?

readonly makes a class field immutable. The field can only be assigned at its declaration (initial value) or inside the constructor; assigning it anywhere else causes a compile error.

class Config {
  readonly apiKey: string;
  constructor(apiKey: string) {
    this.apiKey = apiKey;
  }
}
const c = new Config("abc123");
// c.apiKey = "xyz";  // error
console.log(c.apiKey);

readonly and strict mode

Under strict mode, readonly fields must also be given an initial value or assigned in the constructor. After the first assignment, the field is frozen and no method or external code can change it.

class Config {
  readonly version: number = 1;
  readonly name: string;
  constructor(name: string) {
    this.name = name;
  }
}

Exercise Config class with a readonly field

Define a Config class with a readonly apiKey: string field. Add a constructor that takes apiKey and assigns it with this. Create a new Config("abc123") and print the apiKey field.

Show example solution

class Config {
  readonly apiKey: string;
  constructor(apiKey: string) {
    this.apiKey = apiKey;
  }
}

const c = new Config("abc123");
console.log(c.apiKey);

Test yourself

What happens if you try to change a readonly field outside the constructor?
- Compile error
- It works
- Runtime error
- Returns undefined
Show answer

Compile error — A readonly field can only be assigned in its declaration or inside the constructor. Trying to assign it outside the constructor causes a compile error; it does not wait until runtime.

Complete the readonly modifier

class Config {
  ____ apiKey: string = "abc";
}

Show answer

class Config {
  readonly apiKey: string = "abc";
}

readonly parts

readonly

Immutable field
constructor

Where readonly assignment is allowed
c.apiKey

External read
c.apiKey = "xyz"

External assignment (error)

Next lesson: Readonly parameter

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies