How can you use the "public", "private", and "protected" modifiers in TypeScript?

Question

Accepted Answer

In TypeScript, you can use the `public`, `private`, and `protected` modifiers to control the visibility and accessibility of class members (properties and methods). These modifiers determine whether a member can be accessed from outside the class, or only from within the class or its subclasses. - public: A `public` member can be accessed from anywhere, both within and outside the class. This is the default modifier for class members in TypeScript, so you don't need to specify it explicitly.


class MyClass {
  public myPublicProperty: string;
  public myPublicMethod() {
    // code here
  }
}

const myInstance = new MyClass();
myInstance.myPublicProperty = "value";
myInstance.myPublicMethod();

In this example, the `myPublicProperty` and `myPublicMethod` members are both `public`, so they can be accessed and modified from outside the class. - private: A `private` member can only be accessed from within the class. It cannot be accessed from outside the class or its subclasses.


class MyClass {
  private myPrivateProperty: string;
  private myPrivateMethod() {
    // code here
  }
}

const myInstance = new MyClass();
myInstance.myPrivateProperty = "value"; // ERROR: private property cannot be accessed from outside the class
myInstance.myPrivateMethod(); // ERROR: private method cannot be accessed from outside the class

In this example, the `myPrivateProperty` and `myPrivateMethod` members are both `private`, so they cannot be accessed from outside the class. - protected: A `protected` member can be accessed from within the class or its subclasses. It cannot be accessed from outside the class or its subclasses.


class MyBaseClass {
  protected myProtectedProperty: string;
  protected myProtectedMethod() {
    // code here
  }
}

class MySubClass extends MyBaseClass {
  myMethod() {
    this.myProtectedProperty = "value"; // OK: can access protected property from subclass
    this.myProtectedMethod(); // OK: can access protected method from subclass
  }
}

const myInstance = new MySubClass();
myInstance.myProtectedProperty = "value"; // ERROR: protected property cannot be accessed from outside the class hierarchy
myInstance.myProtectedMethod(); // ERROR: protected method cannot be accessed from outside the class hierarchy

In this example, the `myProtectedProperty` and `myProtectedMethod` members are both `protected`, so they can be accessed from within the `MySubClass` subclass, but not from outside the class hierarchy. Using the `public`, `private`, and `protected` modifiers can help you encapsulate and control access to class members in TypeScript, making your code more modular and maintainable.