Implementing interfaces in classes in Typescript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is an interface in TypeScript?

An interface in TypeScript defines a contract or a shape for objects. It specifies what properties and methods an object should have, without providing the implementation.

beginner

How do you make a class follow an interface in TypeScript?

You use the <code>implements</code> keyword after the class name, followed by the interface name. This means the class must provide all properties and methods defined in the interface.

intermediate

What happens if a class does not implement all properties or methods of an interface it claims to implement?

TypeScript will show an error because the class does not fulfill the contract of the interface. The class must implement all required members.

intermediate

Can a class implement multiple interfaces in TypeScript?

Yes, a class can implement multiple interfaces by listing them separated by commas after the <code>implements</code> keyword.

beginner

Example: What does this code do?<br><pre>interface Animal {<br>  name: string;<br>  makeSound(): void;<br>}<br><br>class Dog implements Animal {<br>  name: string;<br>  constructor(name: string) {<br>    this.name = name;<br>  }<br>  makeSound() {<br>    console.log('Woof!');<br>  }<br>}</pre>

This code defines an interface Animal with a property name and a method makeSound. The class Dog implements this interface by providing the name property and the makeSound method that prints 'Woof!'.

Which keyword is used in TypeScript for a class to follow an interface?

A extends

B implements

C inherits

D uses

The implements keyword is used for a class to follow an interface contract.

What will happen if a class misses a method defined in its interface?

A The interface will be ignored

B The class will work fine

C The method will be added automatically

D TypeScript will show an error

TypeScript enforces that all interface members must be implemented, otherwise it shows an error.

Can a class implement more than one interface?

A Yes, by listing interfaces separated by commas

B No, only one interface is allowed

C Yes, but only if interfaces extend each other

D No, classes cannot implement interfaces

A class can implement multiple interfaces by listing them separated by commas.

What does an interface define?

A The shape of an object (properties and methods)

B The implementation of methods

C The variables inside a class

D The inheritance chain

An interface defines the shape or contract an object must follow, including properties and method signatures.

In this code snippet, what is the role of makeSound()?

interface Animal {
  makeSound(): void;
}
class Cat implements Animal {
  makeSound() { console.log('Meow'); }
}

A It is a variable

B It is a property of the interface

C It is a method the class must implement

D It is a constructor

makeSound() is a method signature in the interface that the class must implement.

Explain how a class implements an interface in TypeScript and why it is useful.

Think about how interfaces act like a promise for the class.

Describe what happens if a class does not fully implement an interface it claims to implement.

What does TypeScript do to keep your code correct?

Practice

1. What does the implements keyword do in a TypeScript class?

easy

A. It ensures the class follows the structure defined by an interface.

B. It creates a new interface inside the class.

C. It imports an interface from another file.

D. It automatically generates methods for the class.

Solution

1. Step 1: Understand the role of interfaces

   Interfaces define a contract of properties and methods that a class must have.

2. Step 2: Role of implements keyword

   The implements keyword makes sure the class follows that contract exactly.

3. Final Answer:

   It ensures the class follows the structure defined by an interface. -> Option A

4. Quick Check:

   implements enforces interface structure [OK]

Hint: Remember: implements means 'follow the interface rules' [OK]

Common Mistakes:

• Thinking implements creates or imports interfaces
• Believing implements auto-generates code
• Confusing implements with extends

2. Which of the following is the correct syntax to make a class Car implement an interface Vehicle?

easy

A. interface Car implements Vehicle {}

B. class Car implements Vehicle {}

C. class Car extends Vehicle {}

D. class Car uses Vehicle {}

Solution

1. Step 1: Identify correct keywords for class and interface

   Classes use the keyword implements to follow interfaces.

2. Step 2: Check syntax correctness

   class Car implements Vehicle {} is the correct way to declare this.

3. Final Answer:

   class Car implements Vehicle {} -> Option B

4. Quick Check:

   Class uses implements for interfaces [OK]

Hint: Use 'implements' keyword after class name for interfaces [OK]

Common Mistakes:

• Using extends instead of implements for interfaces
• Trying to implement interface in interface declaration
• Using 'uses' keyword which doesn't exist

3. What will be the output of this code?

interface Animal {
  name: string;
  speak(): string;
}

class Dog implements Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  speak() {
    return `${this.name} says woof`;
  }
}

const dog = new Dog('Buddy');
console.log(dog.speak());

medium

A. undefined

B. "Dog says woof"

C. "Buddy says woof"

D. Error: Dog does not implement speak()

Solution

1. Step 1: Check class implements interface correctly

   Dog class has property name and method speak() as required.

2. Step 2: Understand method output

   speak() returns a string with the dog's name and 'says woof'.

3. Final Answer:

   "Buddy says woof" -> Option C

4. Quick Check:

   Method returns correct string with name [OK]

Hint: Look for method return values matching console.log output [OK]

Common Mistakes:

• Assuming missing method error when method exists
• Confusing property values with method output
• Ignoring string template usage

4. Identify the error in this code:

interface Shape {
  area(): number;
}

class Circle implements Shape {
  radius: number;
  constructor(radius: number) {
    this.radius = radius;
  }
  area(): string {
    return (Math.PI * this.radius * this.radius).toFixed(2);
  }
}

medium

A. Method area() returns string instead of number.

B. Missing constructor in Circle class.

C. radius property is not declared.

D. Circle should extend Shape, not implement.

Solution

1. Step 1: Check interface method signature

   Interface Shape requires area() to return a number.

2. Step 2: Compare with class method return type

   Circle's area() returns a string because toFixed() returns string.

3. Final Answer:

   Method area() returns string instead of number. -> Option A

4. Quick Check:

   Return type must match interface [OK]

Hint: Match method return types exactly with interface [OK]

Common Mistakes:

• Returning string when interface expects number
• Forgetting to declare properties
• Using extends instead of implements for interfaces

5. You have two interfaces:

interface Printer {
  print(): void;
}
interface Scanner {
  scan(): void;
}

How can you create a class AllInOneMachine that implements both interfaces correctly?

hard

A. interface AllInOneMachine implements Printer, Scanner {}

B. class AllInOneMachine implements Printer {
print() { console.log('Printing'); }
scan() { console.log('Scanning'); }
}

C. class AllInOneMachine extends Printer, Scanner {
print() { console.log('Printing'); }
scan() { console.log('Scanning'); }
}

D. class AllInOneMachine implements Printer, Scanner {
print() { console.log('Printing'); }
scan() { console.log('Scanning'); }
}

Solution

1. Step 1: Understand multiple interface implementation

   TypeScript allows a class to implement multiple interfaces separated by commas.

2. Step 2: Check class methods match all interfaces

   Class must have both print() and scan() methods.

3. Final Answer:

   class AllInOneMachine implements Printer, Scanner { print() { console.log('Printing'); } scan() { console.log('Scanning'); } } -> Option D

4. Quick Check:

   Multiple interfaces implemented with comma [OK]

Hint: Use comma to implement multiple interfaces in one class [OK]

Common Mistakes:

• Using extends instead of implements for interfaces
• Implementing only one interface but adding all methods
• Trying to implement interfaces in interface declaration