Access Modifiers in TypeScript

Access modifiers control the visibility (accessibility) of class members (properties and methods). TypeScript provides three access modifiers:

1. public (Default)
2. private
3. protected

1. Public Access Modifier

• Accessible from anywhere.
• Default access modifier if none is specified.

class Employee {

public name: string;

constructor(name: string) {

this.name = name;

}

public display(): void {

console.log(this.name);

}

}

const emp = new Employee(“Anand”);

console.log(emp.name);

emp.display();

Output

Anand

Anand

Since public is the default, you can also write:

class Employee {

name: string;

constructor(name: string) {

this.name = name;

}

display(): void {

console.log(this.name);

}

}

2. Private Access Modifier

• Accessible only within the same class.
• Cannot be accessed from outside the class.
• Cannot be inherited directly.

class BankAccount {

private balance: number = 10000;

public showBalance(): void {

console.log(this.balance);

}

}

const account = new BankAccount();

account.showBalance();

// console.log(account.balance); // Error

Output

10000

Example

class Login {

private password: string = “Admin@123”;

validate(password: string): boolean {

return this.password === password;

}

}

const login = new Login();

console.log(login.validate(“Admin@123”));

// console.log(login.password); // Error

3. Protected Access Modifier

• Accessible inside the class.
• Accessible in child (derived) classes.
• Not accessible outside the class.

class Animal {

protected sound: string = “Bark”;

}

class Dog extends Animal {

public makeSound() {

console.log(this.sound);

}

}

const dog = new Dog();

dog.makeSound();

// console.log(dog.sound); // Error

Output

Bark

Comparison Table

Modifier	Same Class	Child Class	Outside Class
public	✅	✅	✅
protected	✅	✅	❌
private	✅	❌	❌

Constructor Parameter Properties

Instead of declaring properties separately, you can define them directly in the constructor.

Without Parameter Properties

class Student {

private id: number;

public name: string;

constructor(id: number, name: string) {

this.id = id;

this.name = name;

}

}

With Parameter Properties

class Student {

constructor(

private id: number,

public name: string

) {}

display() {

console.log(this.id, this.name);

}

}

const student = new Student(101, “Anand”);

student.display();

Getters and Setters

Use getters and setters to safely access private members.

class Employee {

private salary: number = 50000;

get Salary(): number {

return this.salary;

}

set Salary(value: number) {

if (value > 0)

this.salary = value;

}

}

const emp = new Employee();

console.log(emp.Salary);

emp.Salary = 65000;

console.log(emp.Salary);

Output

50000

65000

Readonly with Access Modifiers

class Employee {

constructor(

public readonly id: number,

public name: string

) {}

}

const emp = new Employee(101, “Anand”);

console.log(emp.id);

// emp.id = 200; // Error

Real-Time Playwright Example

Configuration Class

class TestConfig {

private baseUrl = “https://example.com”;

public getBaseUrl(): string {

return this.baseUrl;

}

}

const config = new TestConfig();

console.log(config.getBaseUrl());

// console.log(config.baseUrl); // Error

User Credentials

class LoginUser {

constructor(

public username: string,

private password: string

) {}

login() {

console.log(`Logging in as ${this.username}`);

// Password is used internally

}

}

const user = new LoginUser(“admin@test.com”, “Admin@123”);

console.log(user.username);

// console.log(user.password); // Error

user.login();

 

Tags: Access Modifiers in TypeScript, Typescript Training, Typescript Training in Hyderabad