Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Apprendre Extending and Combining Interfaces | Understanding Interfaces
Working with Interfaces and Generics in TypeScript

bookExtending and Combining Interfaces

When building applications in TypeScript, you often need to create complex types that share common properties or behaviors. Rather than duplicating code, you can use interface extension and combination to assemble flexible and reusable types. You achieve this by extending interfaces with the extends keyword or combining multiple interfaces using intersection types with the & operator. These features let you model real-world relationships and requirements more effectively.

12345678910111213141516
interface Person { name: string; age: number; } interface Employee extends Person { employeeId: number; department: string; } const developer: Employee = { name: "Alice", age: 30, employeeId: 101, department: "Engineering" };
copy

By using interface extension, you build upon existing interfaces to create more specialized types. In the example above, the Employee interface extends Person, inheriting its properties and adding new ones. This approach promotes code reuse because you define shared properties once and extend them as needed. It also increases type safety, ensuring that any Employee will always have all properties defined in Person as well as its own.

1234567891011121314
interface Contactable { phone: string; } interface Emailable { email: string; } type ContactInfo = Contactable & Emailable; const customer: ContactInfo = { phone: "555-1234", email: "customer@example.com" };
copy

Extending and combining interfaces with intersection types is useful when you want to describe objects that must satisfy multiple contracts at once. This is especially practical when modeling entities with multiple roles or capabilities. For instance, if you have different interfaces for contact methods, you can combine them to represent a user who must have both a phone number and an email address.

Extending and combining interfaces is common when modeling user roles, permissions, or entities with shared features. For example, an Admin interface might extend a User interface and add properties specific to administrators, while a Manager might combine both Employee and Supervisor interfaces to reflect their responsibilities.

question-icon

Fill in the blanks to extend the User interface and create an Admin interface with an additional role property.

extends { role: string; } const admin: Admin = { username: "superuser", password: "securepass", role: "system" };

Click or drag`n`drop items and fill in the blanks

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 3

Demandez à l'IA

expand

Demandez à l'IA

ChatGPT

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Suggested prompts:

Can you explain the difference between interface extension and intersection types?

Can you give more real-world examples of when to use these features?

How do I decide whether to extend an interface or combine them with intersection types?

Awesome!

Completion rate improved to 9.09

bookExtending and Combining Interfaces

Glissez pour afficher le menu

When building applications in TypeScript, you often need to create complex types that share common properties or behaviors. Rather than duplicating code, you can use interface extension and combination to assemble flexible and reusable types. You achieve this by extending interfaces with the extends keyword or combining multiple interfaces using intersection types with the & operator. These features let you model real-world relationships and requirements more effectively.

12345678910111213141516
interface Person { name: string; age: number; } interface Employee extends Person { employeeId: number; department: string; } const developer: Employee = { name: "Alice", age: 30, employeeId: 101, department: "Engineering" };
copy

By using interface extension, you build upon existing interfaces to create more specialized types. In the example above, the Employee interface extends Person, inheriting its properties and adding new ones. This approach promotes code reuse because you define shared properties once and extend them as needed. It also increases type safety, ensuring that any Employee will always have all properties defined in Person as well as its own.

1234567891011121314
interface Contactable { phone: string; } interface Emailable { email: string; } type ContactInfo = Contactable & Emailable; const customer: ContactInfo = { phone: "555-1234", email: "customer@example.com" };
copy

Extending and combining interfaces with intersection types is useful when you want to describe objects that must satisfy multiple contracts at once. This is especially practical when modeling entities with multiple roles or capabilities. For instance, if you have different interfaces for contact methods, you can combine them to represent a user who must have both a phone number and an email address.

Extending and combining interfaces is common when modeling user roles, permissions, or entities with shared features. For example, an Admin interface might extend a User interface and add properties specific to administrators, while a Manager might combine both Employee and Supervisor interfaces to reflect their responsibilities.

question-icon

Fill in the blanks to extend the User interface and create an Admin interface with an additional role property.

extends { role: string; } const admin: Admin = { username: "superuser", password: "securepass", role: "system" };

Click or drag`n`drop items and fill in the blanks

Tout était clair ?

Comment pouvons-nous l'améliorer ?

Merci pour vos commentaires !

Section 1. Chapitre 3
some-alt