Pular para o conteúdoPedro Farbo
Lição 4 / 525 min

Funções Tipadas

Funções Tipadas

TypeScript permite tipar parâmetros, retorno e até o próprio tipo da função. Isso torna seu código mais seguro e documentado.

Tipando Parâmetros

typescript
function saudacao(nome: string): void {  console.log(`Olá, ${nome}!`);} saudacao("Pedro"); // OKsaudacao(42);      // Erro: Argument of type 'number'...

Tipando Retorno

typescript
function soma(a: number, b: number): number {  return a + b;} function ehPar(n: number): boolean {  return n % 2 === 0;} // TypeScript infere, mas ser explícito é uma boa práticafunction multiplicar(a: number, b: number) {  return a * b; // retorno inferido como number}

Parâmetros Opcionais

Use ? para parâmetros opcionais (devem vir por último):

typescript
function criarUsuario(  nome: string,  email: string,  idade?: number): object {  return { nome, email, idade };} criarUsuario("Pedro", "pedro@email.com");      // OKcriarUsuario("Pedro", "pedro@email.com", 30);  // OK

Parâmetros com Valor Default

typescript
function potencia(base: number, expoente: number = 2): number {  return Math.pow(base, expoente);} potencia(5);     // 25 (5²)potencia(5, 3);  // 125 (5³)

Rest Parameters

Para aceitar número variável de argumentos:

typescript
function somarTodos(...numeros: number[]): number {  return numeros.reduce((acc, n) => acc + n, 0);} somarTodos(1, 2, 3);       // 6somarTodos(1, 2, 3, 4, 5); // 15

Arrow Functions Tipadas

typescript
// Inlineconst dobrar = (n: number): number => n * 2; // Com tipo de função separadotype Operacao = (a: number, b: number) => number; const soma: Operacao = (a, b) => a + b;const subtrair: Operacao = (a, b) => a - b;

Function Overloads

Defina múltiplas assinaturas para uma função:

typescript
function formatar(valor: string): string;function formatar(valor: number): string;function formatar(valor: string | number): string {  if (typeof valor === "string") {    return valor.toUpperCase();  }  return valor.toFixed(2);} formatar("hello");  // "HELLO"formatar(3.14159);  // "3.14"

Funções como Parâmetros

Passe funções como argumentos com tipagem:

typescript
function executar(  callback: (mensagem: string) => void): void {  callback("Operação concluída!");} executar((msg) => console.log(msg)); // Ou com tipo nomeadotype Callback = (mensagem: string) => void; function executarV2(callback: Callback): void {  callback("Operação concluída!");}

Funções em Interfaces

typescript
interface Calculadora {  soma(a: number, b: number): number;  subtrair(a: number, b: number): number;  multiplicar(a: number, b: number): number;  dividir(a: number, b: number): number;} const calc: Calculadora = {  soma: (a, b) => a + b,  subtrair: (a, b) => a - b,  multiplicar: (a, b) => a * b,  dividir: (a, b) => a / b};

This em Funções

TypeScript permite tipar o this:

typescript
interface Botao {  label: string;  onClick(this: Botao): void;} const botao: Botao = {  label: "Clique",  onClick() {    console.log(this.label); // this é tipado como Botao  }};

Funções Assíncronas

typescript
// Promise com tipo genéricoasync function buscarUsuario(id: number): Promise<Usuario> {  const response = await fetch(`/api/usuarios/${id}`);  return response.json();} // Usando entãobuscarUsuario(1).then(usuario => {  console.log(usuario.nome); // TypeScript sabe que é Usuario});

Boas Práticas

  1. Sempre tipe o retorno - ajuda a documentar e prevenir erros
  2. Use parâmetros opcionais com cuidado - podem esconder bugs
  3. Prefira tipos explícitos a any - mesmo em callbacks
  4. Documente funções complexas - JSDoc funciona com TypeScript
typescript
/** * Calcula o preço com desconto * @param preco - Preço original * @param desconto - Percentual de desconto (0-100) * @returns Preço final com desconto aplicado */function calcularDesconto(  preco: number,  desconto: number): number {  return preco * (1 - desconto / 100);}

Conclusão

Funções tipadas são fundamentais para código TypeScript de qualidade. Na próxima e última lição, veremos como usar genéricos para criar funções ainda mais flexíveis.

Gostou do conteúdo? Sua contribuição ajuda a manter tudo online e gratuito!

PIX:0737160d-e98f-4a65-8392-5dba70e7ff3e