> ## 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 Override Field
The `override` modifier in TypeScript is a class member declaration keyword used in a derived class to explicitly state that a method or property (whether instance or static) replaces a corresponding member in its base class. It acts as a compiler-enforced structural safeguard during inheritance, ensuring that the derived member accurately maps to an existing base member.
## Syntax
The `override` keyword is placed directly before the method or property name. If access modifiers (`public`, `protected`), the `static` modifier, or the `readonly` modifier are used, `override` must be positioned after the access modifier and `static` keyword, but before `readonly` or the member name.
```typescript theme={"dark"}
class Base {
methodName(): void {}
protected readonly propertyName: string = "base_value";
public static staticMethodName(): void {}
}
class Derived extends Base {
override methodName(): void { /* ... */ }
protected override readonly propertyName: string = "derived_value";
public static override staticMethodName(): void { /* ... */ }
}
```
## Compiler Mechanics
When the `override` modifier is applied, the TypeScript compiler performs a strict lookup in the base class declaration.
1. **Signature Validation:** The compiler asserts that a member with the exact identifier exists in the base class and that the derived member's type signature is assignable to the base member's type signature.
2. **Absence Rejection:** If the base class does not contain a member with the specified name (due to a typo, renaming, or removal), the compiler throws a `ts(4113)` error: *"This member cannot have an 'override' modifier because it is not declared in the base class."*
## The `noImplicitOverride` Flag
The utility of the `override` keyword is governed by the `noImplicitOverride` compiler option in `tsconfig.json`.
When `noImplicitOverride` is set to `true`:
* The compiler mandates the use of the `override` keyword for derived class members that override concrete base class members.
* The compiler explicitly does *not* require the `override` keyword when implementing `abstract` methods or properties from a base class, as the compiler already enforces their implementation.
* Omitting the keyword on an overriding concrete member results in a `ts(4114)` error: *"This member must have an 'override' modifier because it overrides a member in the base class."*
## Code Visualization
```typescript theme={"dark"}
class BaseConfig {
initialize(): void {}
config: string = "default";
static factory(): BaseConfig {
return new BaseConfig();
}
}
class DerivedConfig extends BaseConfig {
// Valid: Correctly overrides base instance method
override initialize(): void {}
// Valid: Correctly overrides base static method
static override factory(): DerivedConfig {
return new DerivedConfig();
}
// COMPILER ERROR ts(4113): 'setup' does not exist in BaseConfig
override setup(): void {}
// COMPILER ERROR ts(4114) (if noImplicitOverride is true):
// Missing 'override' keyword for an existing base member
config: string = "custom";
}
abstract class AbstractValidator {
abstract validate(): boolean;
}
class ConcreteValidator extends AbstractValidator {
// Valid: 'override' is optional for abstract members even with noImplicitOverride
validate(): boolean {
return true;
}
}
```
## Restrictions
* **Private Members:** Derived classes cannot override `private` base members. Consequently, the `override` modifier cannot be paired with the `private` access modifier, nor can it be used to narrow the visibility of a `public` or `protected` base member to `private`.
* **Constructors:** The `override` modifier cannot be applied to constructor functions.
* **Compilation:** The `override` keyword is strictly a TypeScript design-time construct and is completely erased during transpilation to JavaScript.
Tired of Poor TypeScript Skills? Fix That With Deep Grasping!
Learn More
