How to fix Cannot access protected property 'x' from outside the class in TypeScript

TypeScriptBEGINNERMEDIUMUpdated Dec 8, 2025· 143 views

This TypeScript error occurs when you try to access a protected property from outside its class hierarchy. Protected members are only accessible within the class where they're defined and its subclasses, enforcing proper encapsulation.

Quick fix

Fixes Cannot access protected property 'x' from outside the class

class Animal {
  // Change from protected to public
  public species: string;

  constructor(species: string) {
    this.species = species;
  }
}

const dog = new Animal('Canis familiaris');
console.log(dog.species); // ✓ Works - public property
  1. Change the access modifier to public if external access is needed
  2. Access protected members only from within subclasses
  3. Create public getter/setter methods to expose protected data safely
  4. Move the accessing code inside the class or subclass
typescript — error
class Animal {
  // Change from protected to public
  public species: string;
  constructor(species: string) {
    this.species = species;
  }
}
const dog = new Animal('Canis familiaris');
console.log(dog.species); // ✓ Works - public property
Cannot access protected property 'x' from outside the class

What this error means

TypeScript enforces access control through the protected modifier, which restricts property and method access to the class itself and any classes that inherit from it. When you attempt to access a protected member from outside this class hierarchy (such as from an external function, object instance, or sibling class), TypeScript throws a compilation error. This design prevents violation of encapsulation principles and ensures that internal implementation details remain hidden from external code while still allowing subclasses to access and extend base class functionality.

Typical symptoms

  • Compilation error: 'Property is protected and only accessible within class X and its subclasses'
  • IDE shows red squiggly line when accessing a protected property from outside the class hierarchy
  • TypeScript build fails when trying to access protected members through object instances
  • Error appears when attempting to access protected members from sibling classes in the same hierarchy
  • Protected method calls fail when invoked on instances from external code

Common causes

  1. Attempting to access a protected property directly on a class instance from outside the class hierarchy
  2. Trying to access protected members of a sibling class (classes that share the same parent but are not in a direct inheritance relationship)
  3. Accessing protected members through a base class reference even from within a derived class context
  4. Calling protected methods on instances from external functions or modules
  5. Misunderstanding the difference between protected (subclass accessible) and public (externally accessible) modifiers

How to fix "Cannot access protected property 'x' from outside the class"

1Change the access modifier to public if external access is needed

If you need to access the property from outside the class hierarchy, make it public:

typescript
class Animal {
  // Change from protected to public
  public species: string;

  constructor(species: string) {
    this.species = species;
  }
}

const dog = new Animal('Canis familiaris');
console.log(dog.species); // ✓ Works - public property

Only make members public if they're part of the class's intended external interface.

2Access protected members only from within subclasses

Protected members are designed for use within the inheritance hierarchy:

typescript
class Vehicle {
  protected speed: number = 0;

  protected accelerate(amount: number): void {
    this.speed += amount;
  }
}

class Car extends Vehicle {
  public drive(): void {
    this.accelerate(10); // ✓ OK - accessing from subclass
    console.log(`Speed: ${this.speed} mph`); // ✓ OK - accessing from subclass
  }
}

const myCar = new Car();
myCar.drive(); // ✓ OK - calling public method
// myCar.speed; // ✗ Error - protected property
// myCar.accelerate(5); // ✗ Error - protected method
3Create public getter/setter methods to expose protected data safely

Provide controlled access to protected members through public methods:

typescript
class BankAccount {
  protected balance: number = 0;

  // Public getter provides read access
  public getBalance(): number {
    return this.balance;
  }

  // Public setter with validation
  public deposit(amount: number): void {
    if (amount > 0) {
      this.balance += amount;
    }
  }
}

const account = new BankAccount();
account.deposit(100);
console.log(account.getBalance()); // ✓ Works: 100
// console.log(account.balance); // ✗ Error: protected property
4Move the accessing code inside the class or subclass

Refactor external code into methods within the class hierarchy:

typescript
class User {
  protected email: string;

  constructor(email: string) {
    this.email = email;
  }

  // Internal method can access protected property
  public sendNotification(message: string): void {
    console.log(`Sending to ${this.email}: ${message}`);
  }
}

class AdminUser extends User {
  public updateEmail(newEmail: string): void {
    this.email = newEmail; // ✓ OK - accessing from subclass
  }
}

const admin = new AdminUser('admin@example.com');
admin.sendNotification('Welcome!'); // ✓ OK
admin.updateEmail('new@example.com'); // ✓ OK
// console.log(admin.email); // ✗ Error

Advanced notes

Protected vs Private vs Public:

| Modifier | Same Class | Subclasses | Outside Class |
|----------|-----------|-----------|---------------|
| private | ✓ | ✗ | ✗ |
| protected | ✓ | ✓ | ✗ |
| public | ✓ | ✓ | ✓ |

Sibling class restriction:
TypeScript intentionally disallows accessing protected members of sibling classes (classes that extend the same base class but are not in a direct parent-child relationship). This is because even though both classes inherit from the same parent, they may have different implementations and accessing cross-instance protected members could violate encapsulation:

typescript
class Animal {
  protected name: string = '';
}

class Dog extends Animal {
  compareWith(other: Animal) {
    // ✗ Error: Cannot access 'name' on type 'Animal'
    // Even though Dog has access to its own 'name',
    // 'other' might be a different subclass (Cat, Bird, etc.)
    return this.name === other.name;
  }
}

Compile-time vs Runtime:
TypeScript's protected modifier is enforced only at compile time. After transpilation to JavaScript, protected members become regular properties accessible at runtime. For true runtime privacy, use ES2022 private fields (#) instead.

When to use protected:
Use protected when you want to:
- Share implementation details with subclasses
- Allow extension while hiding internals from external code
- Create template method patterns where base classes define protected hooks for subclasses to override

Avoid overusing protected modifiers as they create tight coupling between base and derived classes.

Frequently asked questions

What does "Cannot access protected property 'x' from outside the class" mean?
TypeScript enforces access control through the protected modifier, which restricts property and method access to the class itself and any classes that inherit from it. When you attempt to access a protected member from outside this class hierarchy (such as from an external function, object instance, or sibling class), TypeScript throws a compilation error. This design prevents violation of encapsulation principles and ensures that internal implementation details remain hidden from external code while still allowing subclasses to access and extend base class functionality.
How do I fix "Cannot access protected property 'x' from outside the class"?
This TypeScript error occurs when you try to access a protected property from outside its class hierarchy. Protected members are only accessible within the class where they're defined and its subclasses, enforcing proper encapsulation.
What causes "Cannot access protected property 'x' from outside the class"?
Attempting to access a protected property directly on a class instance from outside the class hierarchy Trying to access protected members of a sibling class (classes that share the same parent but are not in a direct inheritance relationship) Accessing protected members through a base class reference even from within a derived class context
Is the "Cannot access protected property 'x' from outside the class" error serious?
It is a medium-severity error — more of a blocker than a risk. The steps above resolve it.

Official resources & further reading