HomeChallengesRepsProblemsLeaderboardTake a challenge

Async States & Debounce

Model a request that can fail, handle every state the compiler knows about, and stop firing one per keystroke.

Advanced20 min on the clock6 graded checks · 100 pointsJavaScript + TypeScript
Graded by running your code against real cases.

What you build

  • Declare RequestState<T> as a discriminated union
  • describe(state) returns a sentence for every status
  • load(fetcher) resolves to a success or error state — it never throws
  • debounce(fn, wait) delays the call
  • A burst of calls results in exactly one invocation

Done means

Every state is handled, a rejected fetch becomes an error state, and three rapid calls fire once.

How it is graded

Published in full, before you start — every point is one of these and there is nothing else. Each one runs your code; it is not a search for keywords.

  1. RequestState is a discriminated union of four states+15Union types and narrowing
  2. describe handles every state+20Union types and narrowing
  3. load resolves to a success state+20Async and its failure modes
  4. A rejected fetch becomes an error state, not a throw+20Async and its failure modes
  5. debounce waits before it calls+15Debouncing and throttling
  6. A burst of calls fires exactly once+10Debouncing and throttling

What it teaches

Async and its failure modesintermediate

Every await can reject; modelling idle, loading, success and error explicitly is what stops a slow network showing a blank screen with no explanation.

The rest of JavaScript + TypeScript