25.2 Classic Type Challenges — The Complete TypeScript Course

Classic TypeScript type challenges teach you to read type-level code by solving small, named puzzles. A type challenge is a tiny exercise where the answer is a type alias, not a runtime function.

The goal is not to become clever. The goal is to recognize the moves behind the libraries you already use: pick fields, read function returns, freeze nested shapes, parse strings, and preserve tuple positions.

Warm-ups: pick, return, readonly

A type-level assertion is a checker-only test that fails when two types stop matching. We will use the same Expect<Equal<...>> shape from 25.1.

Start with three classics. MyPick keeps selected object keys. MyReturnType reads a function's return type. DeepReadonly walks nested object shapes and makes every property readonly.

typescript — playgroundtype-checked

type Equal<Left, Right> = [Left] extends [Right]
? [Right] extends [Left]
  ? true
  : false
: false;

type Expect<Answer extends true> = Answer;

type MyPick<Shape, Keys extends keyof Shape> = {
[Key in Keys]: Shape[Key];
};

type MyReturnType<FunctionType> =
FunctionType extends (...args: infer Params) => infer Result ? Result : never;

type DeepReadonly<Value> = Value extends (...args: infer Params) => infer Result
? (...args: Params) => Result
: Value extends object
  ? { readonly [Key in keyof Value]: DeepReadonly<Value[Key]> }
  : Value;

type Plan = "free" | "pro";

type LaunchDraft = {
name: string;
plan: Plan;
karmaRequired: number;
owner: string;
};

type PublicLaunch = MyPick<LaunchDraft, "name" | "plan">;
type PublicCheck = Expect<Equal<PublicLaunch, { name: string; plan: Plan }>>;

type CreateLaunch = (name: string, plan: Plan) => {
id: string;
owner: string;
plan: Plan;
};

type CreatedLaunch = MyReturnType<CreateLaunch>;
type ReturnCheck = Expect<Equal<CreatedLaunch, { id: string; owner: string; plan: Plan }>>;

type FrozenLaunch = DeepReadonly<{
launch: {
  name: string;
  plan: Plan;
};
karma: {
  required: number;
};
}>;

type FrozenCheck = Expect<
Equal<
  FrozenLaunch,
  {
    readonly launch: {
      readonly name: string;
      readonly plan: Plan;
    };
    readonly karma: {
      readonly required: number;
    };
  }
>
>;

const publicLaunch: PublicLaunch = {
name: "Search launch",
plan: "pro",
};

console.log(publicLaunch.name + " is on " + publicLaunch.plan);

// break it: uncomment the next line, then hit Run
// const tooMuch: PublicLaunch = { name: "Search launch", plan: "pro", karmaRequired: 10 };

⌘/Ctrl + Enter to run

→ Search launch is on pro

Read each alias like a small function. MyPick takes a shape and key set, then loops over those keys. MyReturnType pattern-matches a function and names the result type with infer. DeepReadonly branches: functions stay callable, objects get mapped, primitives return unchanged.

String parsing: trim, camel, route params

A string parser type is a type that pattern-matches string literal types. You are not parsing runtime strings here. You are transforming known string sets before erasure.

Template literal types make this possible. The trick is always the same: match the front, name the rest, and stop when no pattern matches.

typescript — playgroundtype-checked

type Equal<Left, Right> = [Left] extends [Right]
? [Right] extends [Left]
  ? true
  : false
: false;

type Expect<Answer extends true> = Answer;

type Blank = " " | "\n" | "\t";

type TrimLeft<Text extends string> =
Text extends `${Blank}${infer Rest}` ? TrimLeft<Rest> : Text;

type CamelCase<Text extends string> =
Text extends `${infer Head}-${infer Tail}`
  ? `${Lowercase<Head>}${Capitalize<CamelCase<Tail>>}`
  : Lowercase<Text>;

type RouteParams<Path extends string> =
Path extends `${string}:${infer Param}/${infer Rest}`
  ? Param | RouteParams<Rest>
  : Path extends `${string}:${infer Param}`
    ? Param
    : never;

type RouteObject<Path extends string> = {
[Param in RouteParams<Path>]: string;
};

type TrimCheck = Expect<Equal<TrimLeft<"  launch">, "launch">>;
type CamelCheck = Expect<Equal<CamelCase<"launch-plan-name">, "launchPlanName">>;
type ParamsCheck = Expect<
Equal<RouteParams<"/users/:user/launches/:launch">, "user" | "launch">
>;

const params: RouteObject<"/users/:user/launches/:launch"> = {
user: "mina",
launch: "search",
};

console.log(params.user + " opened " + params.launch);

// break it: uncomment the next line, then hit Run
// const missingParam: RouteObject<"/users/:user/launches/:launch"> = { user: "mina" };

⌘/Ctrl + Enter to run

→ mina opened search

TrimLeft is shallow recursion over a string. CamelCase changes one dash at a time. RouteParams returns a union of parameter names, then the mapped type turns that union into an object shape.

Tuple gymnastics: last, zip, chunk

A tuple challenge is a type exercise over fixed array positions. This is where types-as-sets meets the tuple-seat idea from Section 2: each position carries its own type.

Last reads the final position. Zip pairs positions from two tuples. Chunk groups items into small tuple batches. These are useful because real helpers often need to preserve call argument positions.

typescript — playgroundtype-checked

type Equal<Left, Right> = [Left] extends [Right]
? [Right] extends [Left]
  ? true
  : false
: false;

type Expect<Answer extends true> = Answer;

type Last<Items extends readonly unknown[]> =
Items extends readonly [...infer Rest, infer Final] ? Final : never;

type Zip<Left extends readonly unknown[], Right extends readonly unknown[]> =
Left extends readonly [infer LeftFirst, ...infer LeftRest]
  ? Right extends readonly [infer RightFirst, ...infer RightRest]
    ? [[LeftFirst, RightFirst], ...Zip<LeftRest, RightRest>]
    : []
  : [];

type Chunk<
Items extends readonly unknown[],
Size extends number,
Current extends readonly unknown[] = [],
> = Items extends readonly [infer First, ...infer Rest]
? Current["length"] extends Size
  ? [Current, ...Chunk<Items, Size>]
  : Chunk<Rest, Size, [...Current, First]>
: Current extends []
  ? []
  : [Current];

type LastCheck = Expect<Equal<Last<["draft", "review", "launch"]>, "launch">>;
type ZipCheck = Expect<
Equal<Zip<["Mina", "Rafi"], ["pro", "free"]>, [["Mina", "pro"], ["Rafi", "free"]]>
>;
type ChunkCheck = Expect<
Equal<Chunk<["draft", "review", "launch"], 2>, [["draft", "review"], ["launch"]]>
>;

const launchChunks: Chunk<["draft", "review", "launch"], 2> = [
["draft", "review"],
["launch"],
];

console.log(launchChunks.length + " launch chunks");

// break it: uncomment the next line, then hit Run
// const wrongLast: Last<["draft", "review", "launch"]> = "draft";

⌘/Ctrl + Enter to run

→ 2 launch chunks

This is the point where challenge solutions can start feeling like a maze. Slow down. Find the inputs, the branch, the recursive call, and the stopping case. If you cannot name those four parts, do not compress the type further.

When you browse that repo, take a guided path:

Start with warm-ups that mirror built-ins you know.
Move to string parsing only after template literal types feel readable.
Move to tuple work only after you can read infer First, ...infer Rest.
Keep one playground open and make every solution prove itself with Expect<Equal<...>>.

Next, you will learn when to stop. The same type-level tools that make libraries feel smart can make a team miserable when they hide intent or slow the checker down.

Checkpoint

Answer all three to mark this lesson complete

Classic Type Challenges

Warm-ups: pick, return, readonly

String parsing: trim, camel, route params

Tuple gymnastics: last, zip, chunk

Checkpoint ✦

Checkpoint