> ## Documentation Index
> Fetch the complete documentation index at: https://docs.syntblaze.com/llms.txt
> Use this file to discover all available pages before exploring further.
# TypeScript Protected Field
A `protected` field in TypeScript is a class member access modifier that restricts the visibility and accessibility of a property or method strictly to the declaring class and any classes that derive from it (subclasses). It establishes a strict compile-time boundary that prevents external instance access while permitting internal inheritance chains.
```typescript theme={"dark"}
class BaseClass {
protected internalState: number;
constructor(value: number) {
this.internalState = value;
}
}
class DerivedClass extends BaseClass {
public mutateState(): void {
// Valid: Accessing a protected member from within a derived class
this.internalState += 1;
}
}
const instance = new DerivedClass(10);
// Compile-time Error: Property 'internalState' is protected and only accessible
// within class 'BaseClass' and its subclasses.
instance.internalState;
```
## Technical Characteristics
**Lexical Visibility**
Access to a `protected` field is validated entirely at compile-time by the TypeScript compiler. The field cannot be referenced on an instantiated object from an external scope. It is resolvable only within the class body of the declaring class or its descendants, subject to specific cross-instance rules.
**Cross-Instance Access and Base Class Restrictions**
TypeScript permits cross-instance access of `protected` members, meaning a method can access the `protected` fields of another instance. However, a critical restriction applies within derived classes: a derived class can only access a `protected` member through an instance of its own type (or its subclasses). It cannot access the `protected` member through a reference typed explicitly as the base class.
```typescript theme={"dark"}
class Base {
protected value: string;
constructor(value: string) {
this.value = value;
}
}
class Derived extends Base {
public compare(otherDerived: Derived, baseRef: Base): boolean {
// Valid: Accessing protected field on another instance of the derived class
if (this.value === otherDerived.value) {
return true;
}
// Compile-time Error: Property 'value' is protected and only accessible
// through an instance of class 'Derived'. This is an instance of class 'Base'.
return this.value === baseRef.value;
}
}
```
**Compilation Erasure**
The `protected` modifier is a TypeScript-specific type-level construct. It does not emit any runtime enforcement mechanisms (such as JavaScript `#` private fields). During transpilation, the `protected` keyword is stripped, and the field is emitted as a standard, publicly accessible JavaScript property.
**Protected Constructors**
When the `protected` modifier is applied to a class `constructor`, it alters the instantiation rules of the class. The class cannot be instantiated directly using the `new` keyword from an external scope, but it can still be extended by derived classes.
```typescript theme={"dark"}
class NonInstantiableBase {
protected constructor() {}
}
class ValidDerived extends NonInstantiableBase {
constructor() {
super(); // Valid: Subclass can invoke the protected constructor
}
}
// Compile-time Error: Constructor of class 'NonInstantiableBase' is protected...
const base = new NonInstantiableBase();
```
Tired of Poor TypeScript Skills? Fix That With Deep Grasping!
Learn More
