Pokročilé TypeScript patterns

TypeScript nabízí mnoho pokročilých funkcí pro vytváření typově bezpečných aplikací. Podíváme se na nejužitečnější patterns a jejich použití.

Generické typy

Flexibilní a typově bezpečné funkce s generickými parametry

Conditional Types

Pokročilé typové podmínky a inference

Utility Types

Vestavěné pomocné typy pro běžné operace

Type Guards

Bezpečné runtime kontroly typů

Generické typy

Generiky jsou základem pro vytváření flexibilních a typově bezpečných funkcí.

examples/generics.ts
// Generic function
function getFirstItem<T>(arr: T[]): T | undefined {
  return arr[0]
}

// Generic constraint
interface HasLength {
  length: number
}

function longest<T extends HasLength>(a: T, b: T): T {
  return a.length >= b.length ? a : b
}

Conditional Types

Conditional types umožňují vytvářet komplexní typové podmínky:

examples/conditional-types.ts
type IsString<T> = T extends string ? true : false

type NonNullable<T> = T extends null | undefined ? never : T

type ExtractPromise<T> = T extends Promise<infer U> ? U : T

Mapped Types

Transformujte existující typy do nových struktur:

examples/mapped-types.ts
type Readonly<T> = {
  readonly [P in keyof T]: T[P]
}

type Partial<T> = {
  [P in keyof T]?: T[P]
}

type Pick<T, K extends keyof T> = {
  [P in K]: T[P]
}

Template Literal Types

Vytvářejte komplexní string typy:

examples/template-literal-types.ts
type EventName = 'click' | 'focus' | 'blur'
type Handler = `on${Capitalize<EventName>}`
// "onClick" | "onFocus" | "onBlur"

type Route = `/api/${string}`

Utility Types v praxi

Praktické použití utility types pro běžné scénáře:

examples/utility-types.ts
interface User {
  id: number
  name: string
  email: string
}

// Readonly user
type ImmutableUser = Readonly<User>

// Optional fields
type PartialUser = Partial<User>

// Pick specific fields
type UserCredentials = Pick<User, 'email' | 'id'>

Type Guards

Vytvářejte bezpečné type guards pro runtime kontroly:

examples/type-guards.ts
function isUser(obj: any): obj is User {
  return (
    typeof obj === 'object' &&
    typeof obj.id === 'number' &&
    typeof obj.name === 'string' &&
    typeof obj.email === 'string'
  )
}

Závěr

Pokročilé TypeScript patterns vám pomohou vytvářet robustnější a bezpečnější aplikace. Experimentujte s různými přístupy a najděte ty, které nejlépe vyhovují vašim potřebám.

Pokročilé TypeScript patterns