Public & Protected Access Modifiers in TypeScript

TypeScript is a superset of JavaScript that introduces new features and ideas on top of the JavaScript language. One of the key concepts in TypeScript is access modifiers, which allows developers to control the visibility of class members and their accessibility outside the class. There are two types of access modifiers in TypeScript: public and protected.

Public Access Modifier

The public access modifier marks a class member as accessible from any part of the program, both inside and outside the class. By default, all class members in TypeScript are public, meaning that they don’t need to be explicitly marked.

Here’s an example of a class with public members:

“`typescript
class Person {
public firstName: string;
public lastName: string;

public getFullName(): string {
return `${this.firstName} ${this.lastName}`;
}
}

const person = new Person();
person.firstName = ‘John’;
person.lastName = ‘Doe’;
console.log(person.getFullName()); // “John Doe”
“`

As you can see, the `firstName`, `lastName`, and `getFullName` members are all public, which means they can be accessed and modified from outside the class.

Protected Access Modifier

The protected access modifier marks a class member as accessible from within the class and its subclasses, but not from outside the class. Protected members cannot be accessed or modified directly from the outside, but they can be accessed and modified from within the class or any of its subclasses.

Here’s an example of a class with protected members:

“`typescript
class Animal {
protected name: string;
protected constructor(name: string) {
this.name = name;
}
}

class Dog extends Animal {
private breed: string;
constructor(name: string, breed: string) {
super(name);
this.breed = breed;
}
public getNameAndBreed(): string {
return `${this.name} (${this.breed})`;
}
}

const dog = new Dog(‘Max’, ‘Labrador’);
console.log(dog.getNameAndBreed()); // “Max (Labrador)”
console.log(dog.name); // Property ‘name’ is protected and only accessible within class ‘Animal’ and its subclasses.
“`

In this example, the `name` member is protected, which means it can be accessed and modified from within the `Animal` class and its subclasses. However, it cannot be accessed or modified directly from outside the `Animal` class or its subclasses. The `Dog` class extends the `Animal` class and can therefore access and modify the `name` member indirectly through the `super` keyword.

FAQs

What is the default access modifier in TypeScript?

The default access modifier in TypeScript is public. If a class member is not explicitly marked with an access modifier, it is assumed to be public.

When should I use the public access modifier?

You should use the public access modifier when you want a class member to be accessible from any part of the program, both inside and outside the class.

When should I use the protected access modifier?

You should use the protected access modifier when you want a class member to be accessible from within the class and its subclasses, but not from outside the class.

Can I mark constructors with access modifiers?

Yes, constructors can be marked with access modifiers. If a constructor is marked as protected, it can only be called from within the class or its subclasses. If it is marked as private, it can only be called from within the class.

Can I use the protected access modifier with static members?

Yes, you can use the protected access modifier with static members. However, protected static members can only be accessed from within the class and its subclasses, not from outside the class.

Can I override a protected member in a subclass?

Yes, you can override a protected member in a subclass. When you override a protected member, you can change its implementation or behavior in the subclass.