Yuzhe's Blog

yuzhes

Parse URL Params

Parse URL Params

Problem Link

Problem

You’re required to implement a type-level parser to parse URL params string into a Union.

ParseURLParams<':id'>            // 'id'
ParseURLParams<'posts/:id'>      // 'id'
ParseURLParams<'posts/:id/:user'> // 'id' | 'user'

Solution

Approach: Template Literal Pattern Matching

Match the :param pattern and collect all parameter names.

type ParseURLParams<T extends string> =
  T extends `${string}:${infer Param}/${infer Rest}`
    ? Param | ParseURLParams<Rest>
    : T extends `${string}:${infer Param}`
      ? Param
      : never

How it works:

  1. First try to match ...:param/rest — extract Param before a / and recurse on Rest.
  2. If that fails, try ...:param at the end of the string — no trailing /.
  3. If neither pattern matches, return never (no params).

The ${string} at the start greedily consumes any prefix before :.

Key Takeaways