Class implementing multiple interfaces in Typescript - Step-by-Step Execution

Concept Flow - Class implementing multiple interfaces

Define Interface A

↓

Define Interface B

↓

Create Class implementing A & B

↓

Implement all methods from A and B

↓

Create instance of Class

↓

Use instance methods from both interfaces

The flow shows defining two interfaces, then a class that implements both, requiring all methods from both interfaces to be defined, then creating and using an instance.

Execution Sample

Typescript

interface A {
  greet(): string;
}
interface B {
  farewell(): string;
}
class Person implements A, B {
  greet() { return "Hello!"; }
  farewell() { return "Goodbye!"; }
}
const p = new Person();
console.log(p.greet());
console.log(p.farewell());

This code defines two interfaces A and B, a class Person implementing both, then creates an instance and calls both methods.

Execution Table

Step	Action	Evaluation	Result
1	Define interface A with greet()	No runtime effect	Interface A ready
2	Define interface B with farewell()	No runtime effect	Interface B ready
3	Define class Person implementing A and B	Class must have greet() and farewell()	Class Person ready
4	Implement greet() returning 'Hello!'	Method greet() defined	greet() returns 'Hello!'
5	Implement farewell() returning 'Goodbye!'	Method farewell() defined	farewell() returns 'Goodbye!'
6	Create instance p of Person	p is Person instance	p ready
7	Call p.greet()	Calls greet()	Output: Hello!
8	Call p.farewell()	Calls farewell()	Output: Goodbye!

💡 All interface methods implemented, instance created, methods called successfully

Variable Tracker

Variable	Start	After 6	After 7	After 8
p	undefined	Person instance	Person instance	Person instance

Key Moments - 2 Insights

Why must the class implement all methods from both interfaces?

Because in row 3 of the execution_table, the class Person declares it implements both interfaces A and B, so TypeScript requires all methods from both to be defined, or it will cause an error.

Do interfaces exist at runtime in TypeScript?

No, as shown in rows 1 and 2, interfaces have no runtime effect; they are only used at compile time for type checking.

Visual Quiz - 3 Questions

Look at the execution_table at step 7, what is the output of p.greet()?

A "Hello!"

B "Goodbye!"

C undefined

D Error

💡 Hint

Check the 'Result' column at step 7 in the execution_table

At which step is the instance 'p' created?

A Step 4

B Step 7

C Step 6

D Step 8

💡 Hint

Look at the 'Action' column for instance creation in the execution_table

If the class Person did not implement farewell(), what would happen?

A Code runs but farewell() returns undefined

B TypeScript error at class definition

C Runtime error when calling farewell()

D No error, farewell() is optional

💡 Hint

Refer to key_moments about implementing all interface methods

Concept Snapshot

interface A { greet(): string; }
interface B { farewell(): string; }
class Person implements A, B {
  greet() { return "Hello!"; }
  farewell() { return "Goodbye!"; }
}
// Class must implement all methods from both interfaces
// Instance can use methods from both interfaces

Full Transcript

This example shows how a TypeScript class can implement multiple interfaces. First, interfaces A and B are defined with methods greet() and farewell(). Then, class Person implements both interfaces, so it must define both methods. An instance p is created from Person. Calling p.greet() outputs 'Hello!' and p.farewell() outputs 'Goodbye!'. Interfaces do not exist at runtime; they only enforce structure at compile time. If any method from the interfaces is missing in the class, TypeScript will give an error.