Aula 4: Tipagem em funções no TypeScript
Introdução
Quando saímos do JavaScript para o TypeScript, uma das primeiras mudanças positivas é a possibilidade de declarar tipos. Em funções, isso significa dizer com clareza que tipos de valores entram e que tipo de valor sai. Esse simples cuidado reduz erros, melhora a leitura do código e facilita a manutenção. Para quem está criando conteúdo didático ou montando um portfólio técnico, escrever funções tipadas demonstra domínio do básico e transmite confiança para quem lê seu código.
A aula avança em ordem lógica. Primeiro você tipa os parâmetros, depois o retorno, em seguida entende o retorno void para funções que apenas executam efeitos e, por fim, aprende a aceitar múltiplos formatos usando union types com estreitamento de tipo.
BORA CODAR!!!
Tipagem de parâmetros em funções
Definição
Tipar parâmetros é declarar explicitamente o tipo de cada argumento que a função espera receber. O objetivo é garantir que a função só seja chamada com dados válidos e também oferecer autocompletar e documentação embutida no editor.
Por que isso importa
Evita chamadas incorretas logo na fase de desenvolvimento, antes de o código rodar em produção. Melhora a comunicação entre módulos e a experiência no editor, já que o TypeScript sabe quais propriedades e métodos estão disponíveis para cada parâmetro.
Exemplo com explicação linha por linha
function saudar(nome: string, idade: number) {
return `Olá, ${nome}. Você tem ${idade} anos.`;
}
Linha 1: declaramos a função saudar com dois parâmetros. O parâmetro nome é do tipo string e o parâmetro idade é do tipo number.
Linha 2: a função retorna uma string interpolando os valores recebidos. Se alguém tentar chamar saudar com uma idade que não seja number, o TypeScript sinaliza erro no momento da escrita.
Tipagem do retorno de uma função
Definição
Tipar o retorno é declarar o tipo do valor que a função entrega ao final da execução. A anotação aparece depois dos parênteses dos parâmetros.
Utilidade e quando usar
Embora o compilador consiga inferir muitos retornos, declarar explicitamente é útil em funções públicas de bibliotecas internas do seu projeto, em funções com lógica complexa ou quando você quer documentar a intenção do resultado. A declaração de retorno também impede retornos acidentais de tipos diferentes.
Exemplo detalhado
function areaDoCirculo(raio: number): number {
const pi = 3.14159;
const area = pi * raio * raio;
return area;
}
Linha 1: a função areaDoCirculo recebe raio do tipo number e declara explicitamente que retorna number.
Linha 2: constante pi com precisão suficiente para o exemplo.
Linha 3: calculamos a área.
Linha 4: retornamos um number. Se alguém tentar retornar uma string por engano, o TypeScript acusará o problema.
Observação útil: em funções assíncronas, o retorno costuma ser Promise<AlgumTipo>. Exemplo curto
async function buscarUsuario(id: number): Promise<string> {
return `Usuário ${id}`;
}
Funções que não retornam nada com void
O que significa
Uma função com retorno void não entrega um valor útil para ser utilizado adiante. Em geral executa um efeito observável, como escrever no console, registrar métricas, enviar um evento ou atualizar a interface.
Quando utilizar
Use void quando o propósito da função é o efeito e não um cálculo que gere valor. Isso comunica a intenção para quem lê e evita que alguém tente usar o retorno como se fosse um dado.
Exemplo prático
function registrarEvento(mensagem: string): void {
const timestamp = new Date().toISOString();
console.log(`[${timestamp}] ${mensagem}`);
}
Linha 1: a função registrarEvento recebe mensagem do tipo string e declara retorno void.
Linha 2: geramos um carimbo de data no formato ISO.
Linha 3: escrevemos no console. Não há valor retornado para ser usado depois.
Unions em funções
Conceito
Union types permitem que um valor seja de mais de um tipo possível. A notação usa o operador vertical para listar as alternativas. Exemplo curto
number | string significa que o valor pode ser number ou string.
Objetivo em parâmetros
Aceitar formatos diferentes e ainda assim manter segurança de tipos. Ao receber um union, você geralmente faz um estreitamento de tipo com typeof, in ou verificações específicas para tratar cada caso com segurança.
Exemplo explicado
function formatarId(id: number | string): string {
if (typeof id === "number") {
const idComoTexto = id.toString().padStart(6, "0");
return `ID${idComoTexto}`;
} else {
const idSanitizado = id.trim().toUpperCase();
return `ID${idSanitizado}`;
}
}
Linha 1: a função formatarId aceita id como number ou string e garante que sempre retorna string.
Linhas 2 e 3: estreitamento com typeof para o caso number. Convertendo para texto e preenchendo com zeros à esquerda.
Linha 4: retornamos o formato padronizado para números.
Linhas 6 e 7: caso contrário, lidamos com string. Removemos espaços e padronizamos em caixa alta.
Linha 8: retornamos o formato padronizado para strings.
Conclusão
Você viu como declarar tipos nos parâmetros, como tipar o retorno, quando usar void e como aceitar múltiplos formatos com union types usando estreitamento de tipo para manter a segurança.
🔗 Link do repositório: https://github.com/guilherme-silvam/TS-aulas-guilhermemachadodev/tree/main/typescript-aula-4
Publicar comentário