A class member cannot have the 'const' keyword in TS [Fixed]

avatar
Borislav Hadzhiev

Last updated: Jan 23, 2023
3 min

banner

# A class member cannot have the 'const' keyword in TS

The error "A class member cannot have the 'const' keyword" occurs when we use the const keyword to declare a property in a class.

To solve the error, remove the const keyword and use the readonly modifier to indicate that a class property shouldn't be changed.

Here is an example of how the error occurs.

index.ts
class Employee { // โ›”๏ธ A class member cannot have the 'const' keyword.ts(1248) const name = 'Bobby Hadz'; }

We can't use the const keyword when declaring a class property.

# Use the readonly modifier to solve the error

Instead, use the readonly modifier.

index.ts
class Employee { readonly name = 'Bobby Hadz'; readonly age = 30; logName() { console.log(this.name); } } const emp = new Employee(); emp.logName(); // ๐Ÿ‘‰๏ธ "Bobby Hadz" console.log(emp.name); // ๐Ÿ‘‰๏ธ "Bobby Hadz"

use readonly modifier to solve the error

We used readonly modifiers to prevent assignment to class properties outside of the constructor.

When using this approach, we are still able to change the value of the properties inside of the constructor function.

index.ts
class Employee { readonly name: string = 'Bobby Hadz'; readonly age: number = 30; constructor() { this.name = 'Freddy'; this.age = 29; } logName() { console.log(this.name); } } const emp = new Employee(); console.log(emp.name); // ๐Ÿ‘‰๏ธ "Freddy"

can still change value of properties inside constructor

Assignment outside of the constructor would cause the type checker to issue an error.

index.ts
class Employee { readonly name: string = 'Bobby Hadz'; readonly age: number = 30; constructor() { this.name = 'Freddy'; this.age = 29; } logName() { console.log(this.name); // โ›”๏ธ Cannot assign to 'name' because it is a read-only property.ts(2540) this.name = 'Bobby'; } }

# Using the static keyword with readonly

If you don't want to be able to change the value in the constructor, use the static keyword with readonly.

index.ts
export class Employee { // ๐Ÿ‘‡๏ธ public if you need to access from outside the class public static readonly department = 'Accounting'; // ๐Ÿ‘‡๏ธ private if you need to access only from inside this class private static readonly salary = 100; // ๐Ÿ‘‡๏ธ protected if you need to access only from this class // and its subclasses protected static readonly age = 30; logSalary() { console.log(Employee.salary); console.log(Employee.age); } } // ๐Ÿ‘‡๏ธ Access on class (NOT on instances) console.log(Employee.department);

using static keyword with readonly

When using the static keyword, we define static methods or properties. Static methods and properties aren't accessed on instances of the class, they are accessed on the class itself.

The department property in the example is declared as public. Properties declared as public can be accessed anywhere.

You should use public when you need to access the property from outside the class.

Private visibility only allows access from inside the class.

Members marked as protected are only visible to the class itself and its subclasses.

Make sure you are accessing static properties and methods on the class, e.g. Employee.myProperty, and not on instances of the class.

# Declaring a constant outside the class

If you don't like any of the approaches covered in this article, declare a constant outside of the class and use it in the class.

index.ts
const name = 'Bobby Hadz'; export class Employee { logName() { console.log(name); } } const employee = new Employee(); employee.logName(); // ๐Ÿ‘‰๏ธ "Bobby Hadz"

declaring constant outside the class

I've also written an article on how to change a read-only property to mutable.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.

Copyright ยฉ 2024 Borislav Hadzhiev