TypeScript: Guia Completo para Desenvolvedores

O TypeScript é uma linguagem de programação de código aberto desenvolvida pela Microsoft que estende o JavaScript, adicionando tipos estáticos. Ele se tornou cada vez mais popular entre desenvolvedores por oferecer uma sintaxe rigorosa que facilita a criação de aplicações mais escaláveis e robustas.

Neste artigo, vamos abordar desde a configuração básica do TypeScript até detalhes avançados.

O que é TypeScript?

O TypeScript adiciona uma camada de tipagem e seleção de tipos ao JavaScript, proporcionando uma segurança que o JavaScript por si só não oferece. A ideia principal é reduzir erros comuns, como o uso de variáveis inesperadas, tornando o código mais seguro e fácil de manter.

Vantagens de usar TypeScript

1. Detecção de Erros em Tempo de Desenvolvimento: Reduz a quantidade de Bugs, pois muitos problemas são identificados antes que o código seja executado.


2. Auto-Documentação: Com o uso de tipos, o código se torna mais legível e autoexplicativo.


3. Melhor Integração com IDEs: Ferramentas como o Visual Studio Code têm excelente suporte para TypeScript, melhorando a produtividade.


4. Escalabilidade: Projetos grandes se beneficiam do rigor do TypeScript, que ajuda a manter o código organizado e seguro.

Configurando o TypeScript no Seu Projeto

Para começar a usar TypeScript, você precisa conectá-lo. Com o Node.js instalado, execute o seguinte comando:

npm install -g typescript

Para verificar se o TypeScript foi instalado corretamente, verifique a versão:

tsc -v

Depois, para criar seu primeiro projeto, crie um arquivo tsconfig.json na raiz do projeto com o seguinte conteúdo:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "outDir": "./dist"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

Esse arquivo configura o compilador TypeScript para converter arquivos .ts para JavaScript, definindo o alvo (ES6), o módulo (CommonJS) e pastas a incluir ou excluir.

Sintaxe Básica e Tipagem no TypeScript

Tipos Primitivos

O TypeScript suporta vários tipos básicos, tais como:

• string

• number

• boolean

• any (aceita qualquer tipo)

• unknown (tipo desconhecido)

• void (sem retorno)

• null e undefined

Exemplo:

let nome: string = "João";
let idade: number = 30;
let ativo: boolean = true;
let qualquer: any = "Qualquer coisa";  // evite o uso de `any` quando possível.

Funções Tipadas

O TypeScript permite especificar os tipos de entrada e saída das funções. Veja o exemplo abaixo:

function somar(a: number, b: number): number {
  return a + b;
}

Neste exemplo, tanto a quanto b são do tipo number, e a função retorna um number. Se tentarmos passar um argumento diferente, o TypeScript indicará um erro.

Interfaces e Tipos (Types)

As interfaces e tipos são fundamentais no TypeScript para definir a estrutura de objetos e ajudar na padronização do código.

Exemplo com Interface:

interface Pessoa {
  nome: string;
  idade: number;
  ativo?: boolean;  // propriedade opcional
}

const pessoa: Pessoa = {
  nome: "Ana",
  idade: 25
};

Tipos de União

O Union Type permite que uma variável ou parâmetro aceite mais de um tipo de dado:

let resultado: string | number;
resultado = "Sucesso";
resultado = 200;  // também é válido

Genéricos

Os Generics permitem criar componentes reutilizáveis. Um exemplo comum é uma função que aceita uma lista de elementos de qualquer tipo:

function imprimirElementos<T>(elementos: T[]): void {
  elementos.forEach(elemento => console.log(elemento));
}

imprimirElementos<string>(["A", "B", "C"]);
imprimirElementos<number>([1, 2, 3]);

Classes e Herança no TypeScript

O TypeScript melhorou a experiência de desenvolvimento orientada a objetos com classes e interfaces.

Exemplo de Classe e Herança

class Animal {
  nome: string;

  constructor(nome: string) {
    this.nome = nome;
  }

  mover(distancia: number): void {
    console.log(`${this.nome} moveu-se ${distancia} metros.`);
  }
}

class Cachorro extends Animal {
  latir(): void {
    console.log("Au au!");
  }
}

const cachorro = new Cachorro("Bolt");
cachorro.mover(10);
cachorro.latir();

Aqui, Cachorro herda de Animal, aproveitando os métodos e atributos da classe pai.

Tipos Avançados no TypeScript

Afirmações de tipo

Type Assertions permitem "forçar" um tipo para uma variável quando você tem certeza de seu tipo.

let algumValor: any = "Olá, TypeScript!";
let tamanhoTexto: number = (algumValor as string).length;

Tipo de guardas

Os Type Guards permitem fazer verificações antes de usar valores que podem ter vários tipos:

function processar(value: string | number) {
  if (typeof value === "string") {
    console.log(value.toUpperCase());
  } else {
    console.log(value.toFixed(2));
  }
}

Decoradores

Os Decorators são uma funcionalidade avançada para metaprogramação, usados para modificar o comportamento de classes e métodos. Este recurso é amplamente usado com Frameworks como o Angular.

function logarClasse(constructor: Function) {
  console.log(`Classe registrada: ${constructor.name}`);
}

@logarClasse
class Produto {
  nome: string;

  constructor(nome: string) {
    this.nome = nome;
  }
}

Tipos de utilidade

O TypeScript fornece tipos utilitários para modificar ou criar novos tipos de maneira eficiente.

• Parcial: Torna todas as propriedades as direções.

• Obrigatório: Torna todas as propriedades obrigatórias.

• Escolha: Seleciona apenas algumas propriedades de um tipo.

• Omitir: Exclui certas propriedades de um tipo.

Exemplo:

interface Usuario {
  nome: string;
  idade: number;
  email: string;
}

type UsuarioParcial = Partial<Usuario>;
type UsuarioEmail = Pick<Usuario, "email">;

Boas Práticas com TypeScript

1. Usar Tipagem Estrita: Prefira strict não tsconfig.json evitar o uso de any.


2. Evite any e unknown Sempre que Possível: Eles podem esconder erros.


3. Organize seu Código em Interfaces e Tipos: Isso ajuda na escalabilidade do projeto.


4. Escreva Comentários e Use Nomes Descritivos: Isso faz uma enorme diferença em grandes projetos.

TypeScript é uma ferramenta poderosa para qualquer desenvolvedor que queira levar o JavaScript para o próximo nível. Com o uso de conceitos de tipagem, interfaces, classes e decoradores, você conseguirá construir aplicações mais confiáveis e simples de manter.