trilha UFPE
O programa
Turmas
Projetos
Materiais
Conheça o Trilha
Inscreva-se
EN
Materiais
Materiais
· Frontend
8. TypeScript
22 min de leitura
→
Anterior
7. JavaScript Assíncrono
Próximo
9. React Fundamentos
→
Nesta página
Objetivo da aula
Pré-requisitos
O que você será capaz de explicar ao final
8.1. O que é TypeScript e por que ele existe
TS = JavaScript + tipos (contratos)
Erros em tempo de desenvolvimento vs runtime
Benefícios reais no mundo real (por que times adotam)
Custos e trade-offs (com honestidade)
Onde ele entra no fluxo: escrever `.ts` → compilar → `.js`
8.2. Modelo mental: inferência vs anotações
Type inference: o TypeScript deduz tipos a partir do valor
Quando você precisa anotar (escrever o tipo explicitamente)
Tipos como “restrições” e como “guia”
Diferença entre tipo (compile-time) e valor (runtime)
8.3. Tipos básicos (a base que você usa sempre)
Primitivos: `string`, `number`, `boolean`
Tipos especiais (os que mais evitam dor de cabeça)
`null` e `undefined` (noções)
`any` (perigoso; quando aparece)
`unknown` (mais seguro que `any`)
`void` (retorno sem valor)
`never` (apenas noção)
Union types (`A | B`)
Type narrowing (refinamento): usar checagens para ficar seguro
Mini-tabela: tipo → exemplo → armadilha comum → dica
8.4. Tipar funções (o ponto de maior valor no dia a dia)
Tipos de parâmetros e retorno
Retorno inferido vs anotado
Parâmetros opcionais (`?`) e valores default
Funções que retornam objetos (retorno tipado)
Arrow functions tipadas (sintaxe)
Boas práticas: tipar a “borda” do sistema
Evitar `any` e preferir `unknown` quando necessário
8.5. Objetos tipados: interfaces e types (comparar com clareza)
Por que tipar objetos
`interface`: foco em “shape” e extensibilidade
`type`: aliases, unions e composições simples
Diferenças práticas (sem dogma)
`readonly` (noção útil)
Excess property checks (noção): por que objeto literal é “mais cobrado”
Exemplos pequenos de ambos e explicação da escolha
8.6. Arrays tipados (lista de coisas)
Sintaxes: `string[]` e `Array<string>`
Arrays de objetos: `User[]`
Tuplas (visão geral)
Métodos de array com tipos: `map`/`filter` preservando tipos
8.7. Promise<T> e assincronicidade tipada
Relembrar: `async function` retorna `Promise`
Tipar retorno de `async`: `Promise<User>` e `Promise<User[]>`
`fetch` e parsing JSON: o ponto onde `unknown` faz diferença
8.8. Boas práticas e “higiene” de TypeScript para iniciantes
Preferir tipos simples e legíveis
Evitar overtyping (tipar tudo sem necessidade)
Union types para estados reais (noção)
Quando usar type assertions (`as`)
Erros comuns (higiene)
8.9. Erros comuns e confusões clássicas
“TypeScript roda no browser”
Usar `any` como “cura”
Usar `as` para calar erro sem entender
Ignorar `string | null` e estourar em runtime
Tipar `fetch` como se fosse verdade sem validação
Confundir `interface`/`type` com “classe”
Achar que “passou no TypeScript, então está correto”
8.10. Glossário rápido
8.11. Resumo final