Objects & Interfaces
Extending Interfaces
Master interface inheritance in TypeScript using the 'extends' keyword, multiple interface extension, overriding property types safely, and extending type aliases.
In TypeScript, interfaces can inherit property and method contracts from other interfaces using the extends keyword. Interface extension promotes code reusability, composition, and logical taxonomy.
1. Single Interface Inheritance
An interface can inherit all members of a parent interface and add new properties:
2. Multiple Interface Inheritance
An interface can inherit from multiple parent interfaces simultaneously by separating parent interface names with commas:
3. Extending Type Aliases
An interface can also extend a Type Alias (provided the type alias represents an object type or intersection of object types):
4. Property Overriding Rules in Interfaces
When an extending interface redeclares a property from a parent interface, the new property type must be assignable to the parent property type (a subtype).
5. Interactive Code Playground
Test interface extension below:
6. Common Pitfalls & Edge Cases
interface Base { data: T }) or Type Intersections instead.7. Summary Comparison Table
| Concept | Syntax | Description |
|---|---|---|
| Single Extension | interface Child extends Parent | Inherits all properties from one parent |
| Multiple Extension | interface Child extends Parent1, Parent2 | Combines properties from multiple interfaces |
interface Child extends ObjectTypeAlias | Inherits shape defined in a type alias |