Pular para o conteúdo principal
eLearner.app
Módulo 4 · Lição 1 de 27/14 no curso~15 min
Lições do módulo (1/2)

Classes e modificadores

TypeScript extends standard ES6 classes with powerful Object-Oriented Programming (OOP) features, such as static typing, access modifiers, and shorthand parameter properties.

Classes and Access Modifiers

In TypeScript, you can control the visibility of class members, properties, and methods using three main keywords:

  • public (default): the member is accessible from anywhere.
  • private: the member is accessible only within the class that defines it.
  • protected: the member is accessible within the class and its subclasses (inheritance).
TS
class Animal {
  public name: string;
  private age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  public getAge(): number {
    return this.age;
  }
}

Parameter Properties

TypeScript offers a shorthand syntax to declare and initialize a class member directly in the constructor. By prefixing a constructor parameter with an access modifier, the property is automatically created and assigned:

TS
// This syntax does exactly the same as the previous example!
class Animal {
  constructor(
    public name: string,
    private age: number,
  ) {}
}

Implementing Interfaces

A class can implement one or more interfaces using the implements keyword. This ensures the class adheres to a specific contract by defining all required methods and properties:

TS
interface Flyable {
  fly(altitude: number): void;
}

class Bird implements Flyable {
  constructor(public name: string) {}

  fly(altitude: number): void {
    console.log(`${this.name} is flying at ${altitude} meters.`);
  }
}

Inheritance and super

TypeScript fully supports class inheritance. A class can extend another class using the extends keyword. If the subclass defines a constructor, it must call the base class constructor using the super() function before accessing this:

TS
class Person {
  constructor(public name: string) {}
}

class Student extends Person {
  constructor(
    name: string,
    public grade: number,
  ) {
    super(name); // Calls the Person constructor
  }
}

Try it yourself

Exercise 1: Car Class and Private Modifier

Exercício#ts.m4.l1.e1
Tentativas: 0Carregando…

Declare a class named Car. It must have a readonly model property (string) defined in the constructor, a private mileage property (number) initialized to 0, a public method drive(miles: number): void that increments mileage by miles, and a getter or method getMileage(): number that returns mileage.

Carregando editor…
Mostrar dica

Use private mileage: number = 0; to make the variable private, and constructor(public readonly model: string) {} as shorthand.

Solução disponível após 3 tentativas

Exercise 2: Shape Interface and Circle Class

Exercício#ts.m4.l1.e2
Tentativas: 0Carregando…

Complete the code by implementing the Circle class which implements the Shape interface. The class must have a readonly radius property (number) set via constructor, and implement getArea(): number (returning Math.PI * radius * radius).

Carregando editor…
Mostrar dica

Use implements Shape on the Circle class and define the getArea(): number method.

Solução disponível após 3 tentativas

Exercise 3: Abstract Vehicle Class and Motorcycle Subclass

Exercício#ts.m4.l1.e3
Tentativas: 0Carregando…

Declare a class named Motorcycle that extends the abstract class Vehicle. It must implement the start() method to return the string 'Motorcycle ' followed by the make (this.make) and ' started'.

Carregando editor…
Mostrar dica

Use class Motorcycle extends Vehicle and implement the start(): string method that returns the correct string.

Solução disponível após 3 tentativas

Exercise 4: Parameter Properties and Inheritance

Exercício#ts.m4.l1.e4
Tentativas: 0Carregando…

Create a class named Employee that defines a readonly property id (number) and a public property name (string) using the constructor shorthand. Then, create a class Developer that extends Employee and adds a public property department (string) via the constructor.

Carregando editor…
Mostrar dica

Use super(id, name) in the Developer constructor and use public department to define the property via the constructor.

Solução disponível após 3 tentativas