How to make class fields or methods public and access from a class instance in TypeScript?

Published April 25, 2022

By default, all the class fields and methods have public visibility and can be accessed from the class instance. We can also explicitly add the public keyword before the field name or method for readability reasons.

TL;DR

/*
  Make class fields or methods public and access
  from a class instance in TypeScript 🚀
*/

// a simple class
class Car {
  public name: string; // <- this field is public
  // 👇🏽 this field is also public but we have
  // not written the `public` keyowrd
  // since it is by default
  yearMade: number;

  constructor(name: string, yearMade: number) {
    this.name = name;
    this.yearMade = yearMade;
  }

  // 👇🏽 this method is public
  public startEngine() {
    console.log("Engine started..");
  }
}

// create an instance of the `Car` class
const lexus = new Car("Lexus", 2022);

// we can access the fields and methods since
// every fields and methods by default have `public` visibility
console.log(lexus.name); // Lexus ✅
console.log(lexus.yearMade); // 2022 ✅
lexus.startEngine(); // Engine started.. ✅

For example, let's say we have a class called Car with 2 properties called name and yearMade and a method called startEngine like this,

// a simple class
class Car {
  name: string;
  yearMade: number;

  startEngine() {
    console.log("Engine started..");
  }
}

All the above fields and methods by default in the Car class can be accessed using a class instance.

To test that let's create an instance of the Car class and try to access the methods and fields.

It can be done like this,

// a simple class
class Car {
  name: string;
  yearMade: number;

  constructor(name: string, yearMade: number) {
    this.name = name;
    this.yearMade = yearMade;
  }

  startEngine() {
    console.log("Engine started..");
  }
}

// create an instance of the `Car` class
const lexus = new Car("Lexus", 2022);

// we can access the fields and methods since
// every fields and methods by default have `public` visibility
console.log(lexus.name); // Lexus ✅
console.log(lexus.yearMade); // 2022 ✅
lexus.startEngine(); // Engine started.. ✅

In addition to this, we can explicitly define the fields or methods as public by using the public keyword before writing the field or method name. Even though writing the public keyword is not needed, some may prefer it for readability reasons.

It can be done like this,

// a simple class
class Car {
  public name: string; // <- this field is public
  yearMade: number; // <- this field is also public but we have not written it

  constructor(name: string, yearMade: number) {
    this.name = name;
    this.yearMade = yearMade;
  }

  // 👇🏽 this method is public
  public startEngine() {
    console.log("Engine started..");
  }
}

// create an instance of the `Car` class
const lexus = new Car("Lexus", 2022);

// we can access the fields and methods since
// every fields and methods by default have `public` visibility
console.log(lexus.name); // Lexus ✅
console.log(lexus.yearMade); // 2022 ✅
lexus.startEngine(); // Engine started.. ✅

We have successfully made the class fields and methods public and can be accessed using the class instance. Yay 🥳!

See the above code live in codesandbox.

That's all 😃!

Feel free to share if you found this useful 😃.


Share on: Facebook Twitter