Why inheritance needs types in Typescript - Quick Recap

Recall & Review

beginner

What is inheritance in TypeScript?

Inheritance allows a class to use properties and methods from another class, making code reusable and organized.

beginner

Why do we need types when using inheritance?

Types help ensure that the child class correctly follows the structure and behavior of the parent class, preventing errors and improving code safety.

intermediate

How do types help with method overriding in inheritance?

Types check that the overridden method in the child class has the same input and output types as in the parent class, keeping the program predictable.

intermediate

What happens if types are not used with inheritance?

Without types, mistakes like wrong method signatures or missing properties can happen, causing bugs that are hard to find.

advanced

Explain how TypeScript's type system supports safe inheritance.

TypeScript uses static types to check class relationships at compile time, ensuring child classes match parent class contracts before running the code.

What does inheritance allow a child class to do?

A Reuse properties and methods from a parent class

B Create unrelated new methods only

C Delete properties from the parent class

D Change the parent class name

Inheritance lets a child class reuse code from a parent class, making programming easier and cleaner.

Why are types important in inheritance?

A To make code run faster

B To ensure child classes follow the parent's structure

C To allow any kind of data without checks

D To remove methods from the parent class

Types help check that child classes correctly match the parent class's design, avoiding errors.

What does TypeScript check when a method is overridden in a child class?

A That the method name is different

B That the method has no parameters

C That the method is private

D That input and output types match the parent method

TypeScript ensures overridden methods keep the same input and output types to maintain consistency.

What risk increases if inheritance is used without types?

A Hard-to-find bugs from wrong method signatures

B Faster program execution

C Automatic fixing of errors

D More readable code

Without types, mistakes in method or property definitions can cause bugs that are difficult to detect.

How does TypeScript's type system help with inheritance?

A By allowing any type without errors

B By running code faster at runtime

C By checking class contracts at compile time

D By ignoring parent class methods

TypeScript checks types before running code to ensure child classes follow parent class rules.

Explain why types are necessary when using inheritance in TypeScript.

Think about how types help avoid mistakes in child classes.

Describe how TypeScript's type system supports safe inheritance.

Focus on when and how TypeScript checks types.

Practice

1. Why do we need types when using inheritance in TypeScript?

easy

A. To ensure the child class follows the structure of the parent class

B. To make the code run faster

C. To allow multiple inheritance

D. To avoid writing constructors

Solution

1. Step 1: Understand inheritance purpose

   Inheritance allows a child class to reuse code from a parent class.

2. Step 2: Role of types in inheritance

   Types ensure the child class matches the parent's structure, preventing mistakes.

3. Final Answer:

   To ensure the child class follows the structure of the parent class -> Option A

4. Quick Check:

   Types keep inheritance safe = A [OK]

Hint: Types keep child classes consistent with parents [OK]

Common Mistakes:

• Thinking types speed up code execution
• Confusing inheritance with multiple inheritance
• Believing constructors are avoided by types

2. Which of the following is the correct way to declare a class Dog that inherits from class Animal in TypeScript?

easy

A. class Dog Animal {}

B. class Dog inherits Animal {}

C. class Dog : Animal {}

D. class Dog extends Animal {}

Solution

1. Step 1: Recall TypeScript inheritance syntax

   TypeScript uses the keyword extends to inherit from a class.

2. Step 2: Check each option

   Only class Dog extends Animal {} uses extends correctly; others use invalid syntax.

3. Final Answer:

   class Dog extends Animal {} -> Option D

4. Quick Check:

   Inheritance uses 'extends' keyword = A [OK]

Hint: Remember: 'extends' keyword for class inheritance [OK]

Common Mistakes:

• Using 'inherits' instead of 'extends'
• Using ':' like other languages (e.g., C#)
• Omitting 'extends' keyword

3. What will be the output of this TypeScript code?

class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  speak() {
    return `${this.name} makes a sound.`;
  }
}

class Dog extends Animal {
  speak() {
    return `${this.name} barks.`;
  }
}

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

medium

A. Buddy makes a sound.

B. Buddy barks.

C. Error: speak method missing

D. undefined barks.

Solution

1. Step 1: Understand class inheritance and method overriding

   Dog inherits from Animal and overrides the speak() method.

2. Step 2: Check the output of dog.speak()

   dog.speak() calls Dog's speak(), returning 'Buddy barks.'

3. Final Answer:

   Buddy barks. -> Option B

4. Quick Check:

   Overridden method runs = D [OK]

Hint: Overridden methods in child class run, not parent's [OK]

Common Mistakes:

• Expecting parent method output
• Thinking speak method is missing
• Assuming name is undefined

4. Identify the error in this TypeScript code:

class Animal {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}

class Dog extends Animal {
  constructor() {
    super();
  }
}

medium

A. Missing argument in super() call

B. Dog class cannot have a constructor

C. name property should be private

D. super() should be called after this.name assignment

Solution

1. Step 1: Check Animal constructor parameters

   Animal's constructor requires a string argument name.

2. Step 2: Check Dog constructor call to super()

   Dog calls super() without arguments, causing an error.

3. Final Answer:

   Missing argument in super() call -> Option A

4. Quick Check:

   super() needs required parameters = B [OK]

Hint: super() must get all required parent constructor args [OK]

Common Mistakes:

• Calling super() without arguments when parent needs them
• Thinking child class can't have constructor
• Confusing property access modifiers

5. You want to create a class Rectangle that inherits from Shape. The Shape class requires a color string property. How should you define the Rectangle constructor to properly use inheritance and types in TypeScript?

hard

A. constructor(color: string) { this.color = color; }

B. constructor(width: number, height: number) { this.width = width; this.height = height; }

C. constructor(color: string, width: number, height: number) { super(color); this.width = width; this.height = height; }

D. constructor() { super(); this.width = 0; this.height = 0; }

Solution

1. Step 1: Understand parent constructor requirements

   Shape requires a color string in its constructor.

2. Step 2: Define Rectangle constructor with all needed parameters

   Rectangle must accept color and pass it to super(color), plus its own properties.

3. Step 3: Check options for correct super call and property assignments

   Only constructor(color: string, width: number, height: number) { super(color); this.width = width; this.height = height; } correctly calls super(color) and assigns width and height.

4. Final Answer:

   constructor(color: string, width: number, height: number) { super(color); this.width = width; this.height = height; } -> Option C

5. Quick Check:

   Pass parent args via super() = C [OK]

Hint: Pass all parent constructor args to super() in child constructor [OK]

Common Mistakes:

• Omitting super() call or its arguments
• Assigning parent properties directly without super()
• Missing child class properties in constructor