Advanced Type Aliases

Generic, recursive, and template literal type aliases for reusable type-level shapes.

Once aliases name simple shapes, the same type keyword can express reusable type-level patterns.

Generic aliases accept type parameters, so one alias can describe many related shapes.

type Nullable<T> = T | null;
 
type ApiResponse<T> = {
  data: T;
  receivedAt: Date;
};
 
type User = { id: string; name: string };
 
const currentUser: Nullable<User> = null;
const response: ApiResponse<User> = {
  data: { id: "user_123", name: "Ada" },
  receivedAt: new Date(),
};

Recursive aliases reference themselves. Template literal types build valid strings from smaller choices.

type TreeNode = {
  value: number;
  left?: TreeNode;
  right?: TreeNode;
};
 
type EventName = "click" | "focus" | "blur";
type HandlerName = `on${Capitalize<EventName>}`;
// "onClick" | "onFocus" | "onBlur"
 
type Route = "/users" | "/posts";
type ApiRoute = `/api${Route}`;

In production

Reach for advanced aliases when valid values follow a real pattern. They are excellent for route names, event handlers, and recursive data structures, but a plain object alias is still better when the shape is simple.

Try it in the TypeScript playground ↗

Enjoyed this? Get more software craft delivered to your inbox.