DEV Community

Cover image for How to make class fields or methods accessible only to its class in TypeScript?
MELVIN GEORGE
MELVIN GEORGE

Posted on • Originally published at melvingeorge.me

How to make class fields or methods accessible only to its class in TypeScript?

Originally posted here!

To make class fields or methods accessible only to its class, we have to use the keyword private before writing the class field and methods in TypeScript.

TL;DR

// a simple class
class Person {
  name: string;
  private age: number; // <- this is a private field

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

  // 👇🏽 this is a private method
  private sayGreeting() {
    console.log(`Hi, ${this.name}`);
  }
}

// another class that extends the `Person` class
class Admin extends Person {
  department: string;

  constructor(name: string, age: number, department: string) {
    super(name, age);
    this.department = department;
  }

  // try to access the `age` private field
  // from the `Person` class
  showDetails() {
    // Error ❌. Property 'age' is private and
    // only accessible within class 'Person'.
    const age = this.age;
  }
}
Enter fullscreen mode Exit fullscreen mode

For example, let's say we have a class called Person with 2 fields called name and age, a constructor, and a method called sayGreeting like this,

// a simple class
class Person {
  name: string;
  age: number;

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

  sayGreeting() {
    console.log(`Hi, ${this.name}`);
  }
}
Enter fullscreen mode Exit fullscreen mode

Currently, all the fields and methods are public by default and can be accessed from an instance of the class.

Now let's make the age field and the sayGreeting method only accessible to the Person class. To do that we need to use the private keyword before the age field and the sayGreeting method like this,

// a simple class
class Person {
  name: string;
  private age: number; // <- this is a private field

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

  // 👇🏽 this is a private method
  private sayGreeting() {
    console.log(`Hi, ${this.name}`);
  }
}
Enter fullscreen mode Exit fullscreen mode

After making the field and method private, to test if the private field and method are working as expected let's make a new class called Admin that extends the Person class.

To know more about extending classes see the blog on How to inherit properties and methods using class in JavaScript. This is written in the context of JavaScript ES6 class but the concept is the same in TypeScript.

Let's make the Admin class that extends the Person class and add a method called showDetails like this,

// a simple class
class Person {
  name: string;
  private age: number; // <- this is a private field

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

  // 👇🏽 this is a private method
  private sayGreeting() {
    console.log(`Hi, ${this.name}`);
  }
}

// another class that extends the `Person` class
class Admin extends Person {
  department: string;

  constructor(name: string, age: number, department: string) {
    super(name, age);
    this.department = department;
  }

  showDetails() {
    // cool code here
  }
}
Enter fullscreen mode Exit fullscreen mode

Now let's try to access the private field age in the showDetails method in the Admin class like this,

// a simple class
class Person {
  name: string;
  private age: number; // <- this is a private field

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

  // 👇🏽 this is a private method
  private sayGreeting() {
    console.log(`Hi, ${this.name}`);
  }
}

// another class that extends the `Person` class
class Admin extends Person {
  department: string;

  constructor(name: string, age: number, department: string) {
    super(name, age);
    this.department = department;
  }

  // try to access the `age` private field
  // from the `Person` class
  showDetails() {
    // Error ❌. Property 'age' is private and
    // only accessible within class 'Person'.
    const age = this.age;
  }
}
Enter fullscreen mode Exit fullscreen mode

As you can see that we cannot access the age field of the Person class in the showDetails method of the Admin class. This is because the age field is private and is available to only the Person class.

We have successfully made the class field and method only accessible to the class. Yay 🥳!

See the above code live in codesandbox.

That's all 😃!

Feel free to share if you found this useful 😃.


Top comments (0)