How to implement class constants in TypeScript ?

In this article, we will try to understand how to create several class constants (properties with constant values) in TypeScript with the help of certain code examples for better concept understanding as well as clarification.

Let us first understand quickly how we may create a class in TypeScript with the following syntax-

Syntax: Use the following syntax provided by TypeScript for creating a class-

class class_name {
    // Some codes....
}

The following examples would help us to understand the above syntax for the creation of the class.

Example 1: In this example, we will simply create a class and thereafter will use data inside it by creating its own instance (or object) while calling any particular data.

class DisplayName {
  name: string = "GeeksforGeeks"
}

let instance = new DisplayName();
console.log(instance.name);

Output:

GeeksforGeeks

Now, we have understood how to create a class in TypeScript. Let us see how to create a class having constant fields or properties with values that are not alterable or changeable.

Example 2: In this example, we will create a class with the same syntax which has been illustrated above. Here we will be using a keyword called readonly which will eventually help us to make that particular field value non-alterable. If we try to change that value then as a result an error message on the user's browser's console.

class DisplayResult{
  readonly name : string = "GeeksforGeeks";
  displayResult() : void{
    console.log(this.name);
    // this.name = "Aman" 
    // Display an error message since 
    // it is readonly class property...
  }
}

let instance = new DisplayResult();
instance.displayResult();

Output:

GeeksforGeeks

Example 3: In this example, we would be creating a class again with the same syntax provided above. Along with readonly keyword in this, we would be using another keyword called static which would eventually help us to directly instantiate that constant property without creating any specific instance for the same.

In other words, this class property would remain constant and not assignable to the class constructor if we use the above-illustrated thing. Also for simplicity, we would be declaring here the static method (which doesn't require any instance instantiation while calling) which will be responsible for displaying our result over the browser's console.

class DisplayResult{
      static readonly username : string = "GeeksforGeeks";
      static displayResult() : void {
  
         // DisplayResult.username = "Aman" 
        // Display an error message since
        // it is readonly class property...
        console.log(DisplayResult.username);
    }
}

DisplayResult.displayResult();

Output:

GeeksforGeeks