telos
Falar comigo
Aula
DA
Engenharia de produto com TypeScriptMódulo 03 · Padrões de projeto em TSAula 03.5

Discriminated unions na prática

18:24 · com Carolina Rabech

Progresso
type Result<T, E = HttpError> =
  | { kind: 'ok'; value: T }
  | { kind: 'err'; error: E }
  | { kind: 'pending' };

function render(r: Result<User>) {
  switch (r.kind) {
    case 'pending': return <Skeleton />;
    case 'err': return <Banner error={r.error} />;
    case 'ok': return <Profile user={r.value} />;
  }
}
Aula 03.5
07:42 / 18:24
Carolina Rabech
Carolina Rabech
Engenheira sênior · ex-Stone e Loft
★ 4.92·8.412 alunos
Sobre essa aula

Discriminated unions são a forma mais barata de eliminar `if-else` aninhado e propagar contexto pelo compilador. Nesta aula a gente refatora um cliente HTTP que mistura sucesso, erro e estado intermediário em uma resposta só — e vê o linter virar revisor de PR.

result.ts · refactor
type Result<T, E = HttpError> =
  | { kind: 'ok'; value: T }
  | { kind: 'err'; error: E }
  | { kind: 'pending' };

function render(r: Result<User>) {
  switch (r.kind) {
    case 'pending': return <Skeleton />;
    case 'err': return <Banner error={r.error} />;
    case 'ok': return <Profile user={r.value} />;
  }
}
Pontos da aula
  • Como o discriminator kind reduz if aninhado em cada consumidor.
  • Por que never no default do switch é o seu melhor amigo em refactor.
  • Custos reais: quando esse padrão começa a doer e como contornar.
  • Comparação direta com try/catch e exception-based.
Recursos baixáveis