Tutorial TypeScript classes: O que são e como usá-las

Em TypeScript, classes permitem que dados sejam organizados e tenham o comportamento previsto, dentro de objetos. Assim sendo, classes estruturam dados de forma clara, além de facilitarem a modelagem de entidades e de conceitos em códigos.

O que são classes em TypeScript?

Classes são funções-chave do TypeScript, considerado um superconjunto do JavaScript. Elas permitem que objetos sejam definidos de forma estruturada, principalmente na programação orientada a objetos (OOP). Classes em TypeScript são como rascunhos para a criação de objetos, que consolidam métodos e dados logicamente relacionados.

A linguagem de programação TypeScript oferece todas as funcionalidades do JavaScript, somadas à possibilidade de tipagem estática. A adição permite a especificação de tipos de dados para variáveis, classes e funções TypeScript, ajudando a detectar erros durante o processo de compilação. Além da segurança de tipos, classes em TypeScript também suportam conceitos como herança e abstração, o que facilita ainda mais o desenvolvimento de aplicações complexas.

Se você fizer uso de classes em TypeScript, será capaz de criar hierarquias de classe claras, com propriedades e métodos herdados. Isso lhe permitirá, por exemplo, reutilizar códigos e estruturas. Em classes, construtores possibilitam a inicialização de instâncias, garantindo que objetos sejam criados de forma consistente.

Sintaxe de classes em TypeScript

Em Typescript, classes têm sintaxe semelhante à do ECMAScript 6 (ES6), já que não deixam de ser uma versão expandida das classes em JavaScript. Uma classe em TypeScript pode incluir vários elementos para a definição da estrutura e do comportamento de objetos. Os principais elementos de uma classe em JavaSCript são:

• Propriedade
• Construtor
• Método

Propriedade

Uma propriedade (property) define o estado de um objeto. Ela armazena valores de dados e pode ser anotada com tipos de dados, com o objetivo de garantir que apenas valores válidos sejam atribuídos, como mostra o exemplo abaixo:

class ClassName {
    propertyName: propertyType;
}

• ClassName: O nome da classe.
• propertyName: O nome da propriedade a ser definida.
• propertyType: O tipo de dado da propriedade.

Observe, a seguir, um exemplo de aplicação mais específico:

class Person {
    name: string;
}

Nele, a classe Person é definida com a propriedade name, do tipo string. O código tem o objetivo de fazer com que as instâncias da classe Person tenham a propriedade name, que armazena cadeias de caracteres (strings).

Construtor

O construtor é o método do TypeScript usado na criação de instâncias (objetos) de uma classe. Ele é útil para realizar a inicialização das propriedades de um objeto, por exemplo. Essencialmente, o construtor define o estado inicial de uma instância. É possível especificar parâmetros no construtor para passar valores ao instanciar classes em TypeScript.

A sintaxe básica de um construtor em TypeScript é a seguinte:

class ClassName {
    constructor(parameter1: Type1, parameter2: Type2, ...) {
    }
}

• constructor: Cada classe pode ter apenas um construtor. Se nenhum construtor for definido, um construtor vazio será criado por padrão.
• parameter: Type: Os parâmetros são opcionais e dependem da classe e de seus requisitos. Parâmetros devem ser marcados com os respectivos tipos de dados.

Observe um exemplo de construtor em TypeScript:

class Person {
    firstName: string;
    lastName: string;
    constructor(firstName: string, lastName: string) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
}

No código acima, a classe Person possui um construtor que aceita dois parâmetros: firstName e lastName. Com a criação de uma instância dessa classe, ambos os parâmetros são passados, o que faz com que o construtor inicialize as propriedades firstName e lastName da instância, juntamente com os valores correspondentes. A palavra-chave this faz referência à instância atual da classe na qual o código é executado.

Métodos

Em TypeScript, métodos são funções definidas dentro de classes, que podem ser aplicadas às respectivas instâncias. Métodos permitem que você execute ações ou operações específicas no contexto de uma classe. Veja:

class ClassName {
    // ...
    methodName(parameter1: Type1, parameter2: Type2, ...): ReturnType {
    }
    // ...
}

• methodName: O nome do método.
• parameter: Type: Parâmetros opcionais que o método aceita.
• ReturnType: O tipo de dado que determina o valor que o método retornará. Para que o método não retorne nenhum valor, especifique void.

Para acessar uma propriedade ou chamar um método em uma instância de uma classe em TypeScript, use o operador ponto (.), seguido pelo nome do método e pelos argumentos correspondentes, caso o método necessite de parâmetros.

class Person {
    firstName: string;
    lastName: string;
    constructor(firstName: string, lastName: string) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
    getFullName(): string {
        return this.firstName + " " + this.lastName;
    }
}
const person = new Person("John", "Doe");
const fullName = person.getFullName();

No código acima, a função getFullName foi aplicada para criar e retornar o nome completo da pessoa solicitada. Para tanto, ela deve acessar os valores das propriedades firstName e lastName, que foram definidas e inicializadas no construtor da classe. O objeto person, criado com a palavra-chave new, é seguido do nome da classe e dos parâmetros necessários. Por fim, o método concatena as duas strings quando chamado, e retorna o nome completo, também como string. Nesse exemplo, o resultado para o objeto person será “John Doe”.

Exemplos de aplicação de classes em TypeScript

Em TypeScript, classes oferecem diversos mecanismos para organizar e controlar a estrutura e o comportamento de objetos em códigos. A seguir, apresentaremos alguns conceitos que podem lhe ajudar a começar a usar classes em TypeScript.

Visibilidade

A visibilidade regula o acesso às propriedades e aos métodos dentro e fora de classes. O TypeScript possui três modificadores de visibilidade: public, private e protected.

• public (padrão): Propriedades e métodos classificados como public podem ser acessados de qualquer lugar, tanto de dentro quanto de fora de uma classe.
• private: Tratam-se de propriedades e métodos que só podem ser acessados dentro da própria classe — eles não são acessíveis a partir de trechos de código externos.
• protected: Propriedades e métodos marcados como protected podem ser acessados pela classe em si e por classes derivadas (herança), mas não a partir de trechos de código externos.

Os três modificadores asseguram o controle, o encapsulamento e a segurança das propriedades e dos métodos em TypeScript, garantindo uma estrutura robusta e modular para as aplicações.

class Person {
    private socialSecurityNumber: string;
    constructor(ssn: string) {
        this.socialSecurityNumber = ssn;
    }
    greet() {
        console.log("Hello, I am a person with SSN: " + this.socialSecurityNumber);
    }
}
const person = new Person("123-45-6789");
person.greet();

No exemplo de código acima, socialSecurityNumber é uma propriedade privada que só pode ser acessada dentro da classe Person. O método greet, por sua vez, pode ser acessado de fora da classe.

Herança

Herança é um conceito fundamental da programação orientada a objetos (OOP), tanto do TypeScript quanto de outras linguagens de programação web. Ela permite a criação de novas classes baseadas em uma superclasse (classe base) já existente. A subclasse (classe derivada) herda as propriedades e os métodos da classe base, sendo capaz de estender ou modificar elementos.

class Animal {
    name: string;
    constructor(name: string) {
        this.name = name;
    }
    makeSound() {
        console.log("Some generic sound");
    }
}
class Dog extends Animal {
    makeSound() {
        console.log(this.name + " barks");
    }
}
const myDog = new Dog("Buddy");
myDog.makeSound();

No exemplo, a classe Dog herda a superclasse Animal pelo uso da palavra-chave extends. A classe derivada Dog substitui o método makeSound para adicionar um comportamento específico, ao mesmo tempo em que herda a propriedade name da classe Animal.

Readonly

Ao fazer uso da palavra-chave readonly, você poderá declarar propriedades de classes em TypeScript, assim como classificar objetos como somente leitura. Após a inicialização de uma propriedade como somente leitura, seu valor não pode mais ser alterado.

class Circle {
    readonly pi: number = 3.14159;
    radius: number;
    constructor(radius: number) {
        this.radius = radius;
    }
    getArea() {
        return this.pi    *this.radius*    this.radius;
    }
}
const myCircle = new Circle(5);
console.log(myCircle.getArea()); // Output: ≈ 78,54

No código acima, a propriedade pi é declarada como somente leitura e inicializada no construtor. Após a inicialização, o valor de pi não pode ser alterado. Se houver uma tentativa de modificar o valor de pi após a inicialização, o TypeScript exibirá um erro de compilação.