Loading...
Loading...
Implement branded (nominal/opaque) types in TypeScript to prevent accidental mixing of structurally identical types. Use when writing type-safe IDs (UserId, PostId), validated strings (Email, URL), unit-specific numbers (Meters, Seconds), or any scenario requiring nominal typing in TypeScript's structural type system.
npx skill4agent add iaskshahram/branded-types branded-typesUserIdPostIdstringtype UserId = string
type PostId = string
function getUser(id: UserId) { /* ... */ }
const postId: PostId = "post-123"
getUser(postId) // No error! Both are just `string`Brandunique symbol// brand.ts
declare const __brand: unique symbol
type Brand<T, B extends string> = T & { readonly [__brand]: B }import type { Brand } from './brand'
type UserId = Brand<string, 'UserId'>
type PostId = Brand<string, 'PostId'>
type Email = Brand<string, 'Email'>
type Meters = Brand<number, 'Meters'>
type Seconds = Brand<number, 'Seconds'>
type PositiveInt = Brand<number, 'PositiveInt'>UserIdPostIdfunction getUser(id: UserId) { /* ... */ }
const postId = "post-123" as PostId
getUser(postId) // TS Error: PostId is not assignable to UserIdasfunction createUserId(id: string): UserId {
if (!id || id.length === 0) throw new Error('Invalid UserId')
return id as UserId
}
function validateEmail(input: string): Email {
if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(input)) {
throw new Error('Invalid email')
}
return input as Email
}
function toPositiveInt(n: number): PositiveInt {
if (!Number.isInteger(n) || n <= 0) throw new Error('Must be positive integer')
return n as PositiveInt
}as| Pattern | Approach | Strength | Verbosity |
|---|---|---|---|
A | | Good | Low |
B Per-type | | Strongest | High |
C Generic | | Strong | Low |
type UserId = Brand<string, 'UserId'>
type PostId = Brand<string, 'PostId'>
type CommentId = Brand<string, 'CommentId'>
function getPost(postId: PostId) { /* ... */ }
function deleteComment(commentId: CommentId) { /* ... */ }type Email = Brand<string, 'Email'>
type NonEmptyString = Brand<string, 'NonEmptyString'>
type SanitizedHTML = Brand<string, 'SanitizedHTML'>
type TranslationKey = Brand<string, 'TranslationKey'>type Meters = Brand<number, 'Meters'>
type Feet = Brand<number, 'Feet'>
type Seconds = Brand<number, 'Seconds'>
type Milliseconds = Brand<number, 'Milliseconds'>
type Percentage = Brand<number, 'Percentage'> // 0-100type AccessToken = Brand<string, 'AccessToken'>
type RefreshToken = Brand<string, 'RefreshToken'>
type ApiKey = Brand<string, 'ApiKey'>// WRONG — __brand does not exist at runtime
if ((value as any).__brand === 'UserId') { /* ... */ }as// BAD — no validation, defeats the purpose
const userId = someString as UserId
// GOOD — validated constructor
const userId = createUserId(someString)asstringnumber// file-a.ts — Brand<string, 'Id'>
// file-b.ts — Brand<number, 'Id'>
// These share the brand name 'Id' but mean different things!'UserId''PostId''Id'import { z } from 'zod'
const UserIdSchema = z.string().uuid().brand<'UserId'>()
type UserId = z.infer<typeof UserIdSchema> // string & Brand<'UserId'>
const parsed = UserIdSchema.parse(input) // typed as UserIdimport { text } from 'drizzle-orm/pg-core'
// Brand the column output type
const users = pgTable('users', {
id: text('id').primaryKey().$type<UserId>(),
})
// Queries return UserId, not plain string
const user = await db.select().from(users).where(eq(users.id, userId))| Scenario | Use branded types? |
|---|---|
| Multiple ID types that should not mix | Yes |
| Validated vs. unvalidated data | Yes |
| Unit-specific numbers (meters vs feet) | Yes |
| Tokens/secrets vs plain strings | Yes |
| Small script with few types | Probably not |
| Single ID type in a small project | Probably not |
| Need runtime type discrimination | Use discriminated unions instead |