$devvkit resources --cheatsheet typescript-cheatsheet

TypeScript Cheatsheet

[programming]

Every essential TypeScript pattern: annotations, interfaces, generics, unions, utility types, and advanced patterns, with syntax and real use cases.70 commands · 7 sections

TypeScript adds a type system to JavaScript. This cheatsheet covers the patterns you write daily: primitive annotations, interfaces and type aliases, generics, unions and intersections, utility types, and the advanced patterns that make large codebases safe.

Every entry shows real syntax followed by the use case: when and why you reach for it.

Basic Types & Annotations12

$const n: number = 42

Use case: Annotate a number.Example: const rate: number = 0.05

$const s: string = "hi"

Use case: Annotate a string.Example: const url: string = "https://www.devvkit.com"

$const b: boolean = true

Use case: Annotate a boolean.Example: const debug: boolean = false

$const a: number[] = [1, 2]

Use case: Array type: also string[], boolean[].Example: const ids: number[] = [1, 2, 3]

$const t: [string, number] = ["a", 1]

Use case: Tuple: fixed length and types.Example: const pair: [string, number] = ["port", 3000]

$const x: unknown = JSON.parse(raw)

Use case: Unknown: safe for unvalidated data; narrow before use.Example: const data: unknown = JSON.parse(input)

$const x: any = ...

Use case: Any: disables checks. Escape hatch, not a default.Example: // avoid; prefer unknown

$const f: () => void = () => {}

Use case: Function type annotation.Example: const handler: (id: number) => Promise<void> = async id => {...}

$let x: string | null = null

Use case: Nullable type: union with null.Example: let current: string | null = null

$const n: number = parseInt(s, 10)

Use case: Type for parsed values: parse returns number, not string.Example: const port: number = parseInt(process.env.PORT!, 10)

$const x = value as string

Use case: Type assertion: override when YOU know more than TS.Example: const el = document.getElementById("app") as HTMLDivElement

$const x = value!

Use case: Non-null assertion: "trust me, it is defined".Example: const host = config.host!

Interfaces & Type Aliases10

interface User {
  id: number
  name: string
}

Use case: Define an object shape: the core TypeScript declaration.Example: interface User { id: number name: string plan: "free" | "pro" }

interface User { id: number }
interface User { email: string }

Use case: Declaration merging: extend the same interface across files.Example: declare global { interface Window { __DEV__: boolean } }

$interface A extends B { }

Use case: Interface inheritance.Example: interface Admin extends User { role: "admin" }

interface User {
  name?: string
}

Use case: Optional property: may be absent.Example: interface Config { timeout?: number }

interface User {
  readonly id: number
}

Use case: Readonly property: cannot be reassigned.Example: interface Point { readonly x: number }

$type ID = string | number

Use case: Type alias: unions, primitives, anything.Example: type ID = string | number

$type Callback = (err: Error | null, data?: unknown) => void

Use case: Alias for function signatures: reusable callback types.Example: type Handler = (event: MouseEvent) => void

$type Status = "idle" | "loading" | "success" | "error"

Use case: Union of string literals: enumerate valid values.Example: type Status = "idle" | "loading" | "done"

$interface Indexed { [key: string]: number }

Use case: Index signature: dictionaries and maps.Example: interface Counts { [key: string]: number }

interface User {
  [key: string]: unknown
}

Use case: Index signature for unknown props: flexible objects.Example: interface Row { id: number [key: string]: unknown }

Generics8

function identity<T>(x: T): T {
  return x
}

Use case: Generic function: type follows the caller.Example: const first = <T,>(arr: T[]): T | undefined => arr[0]

interface Box<T> {
  value: T
}

Use case: Generic interface: containers and wrappers.Example: interface ApiResponse<T> { data: T ok: boolean }

$type Result<T> = { ok: true; value: T } | { ok: false; error: string }

Use case: Generic discriminated union: the Result pattern.Example: type Result<T> = { ok: true; value: T } | { ok: false; error: string }

$function f<T extends HasId>(x: T)

Use case: Generic with constraint: T must have an id.Example: function byId<T extends { id: number }>(items: T[], id: number): T | undefined { return items.find(i => i.id === id) }

$function f<T, U>(a: T, b: U)

Use case: Multiple type parameters.Example: function pair<T, U>(a: T, b: U): [T, U] { return [a, b] }

$async function fetchJson<T>(url: string): Promise<T>

Use case: Generic async: type-safe API calls.Example: async function get<T>(url: string): Promise<T> { const r = await fetch(url) return r.json() as T }

$class Stack<T> { push(x: T) {} }

Use case: Generic class.Example: class Queue<T> { items: T[] = [] push(x: T) { this.items.push(x) } }

$function f<T = string>(x: T)

Use case: Default type parameter.Example: function makeId<T = string>(seed: T): string { return String(seed) }

Union & Intersection Types7

$type A = string | number

Use case: Union: value is one of these.Example: let input: string | number

$if (typeof x === "string")

Use case: Narrow a union with typeof.Example: function f(x: string | number) { if (typeof x === "string") return x.toUpperCase() return x.toFixed(2) }

$"key" in obj

Use case: Narrow with the in operator: property presence.Example: if ("wheels" in vehicle) { vehicle.wheels }

$if (Array.isArray(x))

Use case: Narrow arrays vs single values.Example: function f(x: string | string[]) { const items = Array.isArray(x) ? x : [x] }

interface Circle { kind: "circle"; radius: number }
interface Square { kind: "square"; size: number }

Use case: Discriminated union: each member has a literal tag.Example: type Shape = Circle | Square function area(s: Shape) { switch (s.kind) { case "circle": return Math.PI * s.radius ** 2 case "square": return s.size ** 2 } }

$type Admin = User & { role: "admin" }

Use case: Intersection: combine types into one.Example: type SuperUser = User & { permissions: string[] }

$const exhaustive: never = x

Use case: Never: exhaustiveness check; compiler errors on unhandled cases.Example: function assertNever(x: never): never { throw new Error("unhandled: " + x) }

Utility Types13

$Partial<User>

Use case: All properties optional: update payloads.Example: function update(id: number, patch: Partial<User>) { }

$Required<User>

Use case: All properties required.Example: function create(u: Required<PartialUser>) { }

$Pick<User, "id" | "name">

Use case: Select specific properties.Example: type PublicUser = Pick<User, "id" | "name">

$Omit<User, "password">

Use case: Remove specific properties.Example: type SafeUser = Omit<User, "password" | "token">

$Readonly<User>

Use case: All properties readonly: frozen configs.Example: type ImmutableConfig = Readonly<Config>

$Record<string, number>

Use case: Object map type: keys to values.Example: const counts: Record<string, number> = {}

$ReturnType<typeof fn>

Use case: A function's return type: derive without rewriting.Example: type Fetched = ReturnType<typeof fetchData>

$Parameters<typeof fn>

Use case: A function's parameter tuple.Example: type Args = Parameters<typeof update>[0]

$Exclude<"a" | "b" | "c", "a">

Use case: Remove members from a union.Example: type WithoutAdmin = Exclude<Role, "admin">

$Extract<"a" | "b", "a" | "c">

Use case: Keep only intersecting members.Example: type Common = Extract<RoleA, RoleB>

$NonNullable<T>

Use case: Strip null and undefined.Example: const host: NonNullable<string | null> = getHost()

$Awaited<Promise<T>>

Use case: Unwrap promise types: async helper types.Example: type Data = Awaited<ReturnType<typeof load>>

$string | number extends `${infer U}` ? U : never

Use case: Template literal types: derive from string patterns (advanced).Example: type Endpoint = `api/v${number}/${string}`

Functions & Classes10

$function f(a: number, b?: string): boolean

Use case: Typed signature: optional param and return type.Example: function retry(n: number, delayMs?: number): boolean { ... }

$const f = (x: number): number => x * 2

Use case: Typed arrow function.Example: const double = (n: number): number => n * 2

$function f(...rest: string[]): void

Use case: Typed rest parameters.Example: function log(...lines: string[]): void { console.log(lines.join("\n")) }

$function f(x: number): number | undefined

Use case: Union return: may fail gracefully.Example: function findId(name: string): number | undefined { ... }

class User {
  constructor(private name: string) {}
}

Use case: Parameter properties: shorthand for private fields.Example: class Api { constructor(private baseUrl: string, private key: string) {} }

class User {
  private secret = ""
  protected role = "user"
  public name = ""
}

Use case: Access modifiers: private, protected, public.Example: class Account { private balance = 0 public deposit(n: number) { this.balance += n } }

class User {
  static create(): User { return new User() }
}

Use case: Static members: factories and singletons.Example: class Config { private static instance: Config static get(): Config { return this.instance ??= new Config() } }

$class A implements B { }

Use case: Implement an interface: contract enforcement.Example: class JsonRepo implements Repository<User> { ... }

class Dog extends Animal {
  constructor() { super() }
}

Use case: Class inheritance with super call.Example: class AdminUser extends User { constructor(name: string) { super(name) } }

$abstract class Shape { abstract area(): number }

Use case: Abstract class: blueprint with abstract methods.Example: abstract class Parser { abstract parse(raw: string): unknown }

Advanced Patterns10

$satisfies

Use case: Check a value against a type WITHOUT widening it: keeps literal types.Example: const routes = { home: "/", user: (id: number) => `/u/${id}`, } satisfies Record<string, string | ((id: number) => string)>

$as const

Use case: Freeze literals: readonly tuple/object literal types.Example: const COLORS = ["red", "green"] as const type Color = typeof COLORS[number]

$type Keys = keyof typeof obj

Use case: Keyof: keys of an object type as a union.Example: type ConfigKey = keyof typeof config

$type V = T[K]

Use case: Indexed access type: the type of a property.Example: type Name = User["name"]

$type Mapped = { [K in keyof T]: boolean }

Use case: Mapped types: transform every property.Example: type Flags<T> = { [K in keyof T]: boolean }

$function f<T extends object>(obj: T): T & { saved: true }

Use case: Intersection return: augment what you return.Example: function persist<T extends { id: number }>(obj: T): T & { persistedAt: Date } { ... }

$declare module "*.css" { const css: string; export default css }

Use case: Module declaration: type ambient modules.Example: declare module "*.png" { const src: string export default src }

declare global {
  interface Window { gtag?: (a: string, b: unknown) => void }
}

Use case: Augment global types: extend Window, NodeJS.ProcessEnv.Example: declare global { namespace NodeJS { interface ProcessEnv { OPENAI_KEY?: string } } }

$import type { User } from "./types"

Use case: Type-only import: erased at compile time, no runtime cycle.Example: import type { ApiResponse } from "./api"

$type Narrow<T> = T extends string ? "str" : "other"

Use case: Conditional types: choose a type based on another.Example: type IsString<T> = T extends string ? true : false

TypeScript Cheatsheet

Every essential TypeScript pattern: annotations, interfaces, generics, unions, utility types, and advanced patterns, with syntax and real use cases.

Every entry shows real syntax followed by the use case: when and why you reach for it.

Basic Types & Annotations

const n: number = 42: Annotate a number.

Example: const rate: number = 0.05

const s: string = "hi": Annotate a string.

Example: const url: string = "https://www.devvkit.com"

const b: boolean = true: Annotate a boolean.

Example: const debug: boolean = false

const a: number[] = [1, 2]: Array type: also string[], boolean[].

Example: const ids: number[] = [1, 2, 3]

const t: [string, number] = ["a", 1]: Tuple: fixed length and types.

Example: const pair: [string, number] = ["port", 3000]

const x: unknown = JSON.parse(raw): Unknown: safe for unvalidated data; narrow before use.

Example: const data: unknown = JSON.parse(input)

const x: any = ...: Any: disables checks. Escape hatch, not a default.

Example: // avoid; prefer unknown

const f: () => void = () => {}: Function type annotation.

Example: const handler: (id: number) => Promise<void> = async id => {...}

let x: string | null = null: Nullable type: union with null.

Example: let current: string | null = null

const n: number = parseInt(s, 10): Type for parsed values: parse returns number, not string.

Example: const port: number = parseInt(process.env.PORT!, 10)

const x = value as string: Type assertion: override when YOU know more than TS.

Example: const el = document.getElementById("app") as HTMLDivElement

const x = value!: Non-null assertion: "trust me, it is defined".

Example: const host = config.host!

Interfaces & Type Aliases

interface User {
  id: number
  name: string
}

: Define an object shape: the core TypeScript declaration.

Example: interface User { id: number name: string plan: "free" | "pro" }

interface User { id: number }
interface User { email: string }

: Declaration merging: extend the same interface across files.

Example: declare global { interface Window { __DEV__: boolean } }

interface A extends B { }: Interface inheritance.

Example: interface Admin extends User { role: "admin" }

interface User {
  name?: string
}

: Optional property: may be absent.

Example: interface Config { timeout?: number }

interface User {
  readonly id: number
}

: Readonly property: cannot be reassigned.

Example: interface Point { readonly x: number }

type ID = string | number: Type alias: unions, primitives, anything.

Example: type ID = string | number

type Callback = (err: Error | null, data?: unknown) => void: Alias for function signatures: reusable callback types.

Example: type Handler = (event: MouseEvent) => void

type Status = "idle" | "loading" | "success" | "error": Union of string literals: enumerate valid values.

Example: type Status = "idle" | "loading" | "done"

interface Indexed { [key: string]: number }: Index signature: dictionaries and maps.

Example: interface Counts { [key: string]: number }

interface User {
  [key: string]: unknown
}

: Index signature for unknown props: flexible objects.

Example: interface Row { id: number [key: string]: unknown }

Generics

function identity<T>(x: T): T {
  return x
}

: Generic function: type follows the caller.

Example: const first = <T,>(arr: T[]): T | undefined => arr[0]

interface Box<T> {
  value: T
}

: Generic interface: containers and wrappers.

Example: interface ApiResponse<T> { data: T ok: boolean }

type Result<T> = { ok: true; value: T } | { ok: false; error: string }: Generic discriminated union: the Result pattern.

Example: type Result<T> = { ok: true; value: T } | { ok: false; error: string }

function f<T extends HasId>(x: T): Generic with constraint: T must have an id.

Example: function byId<T extends { id: number }>(items: T[], id: number): T | undefined { return items.find(i => i.id === id) }

function f<T, U>(a: T, b: U): Multiple type parameters.

Example: function pair<T, U>(a: T, b: U): [T, U] { return [a, b] }

async function fetchJson<T>(url: string): Promise<T>: Generic async: type-safe API calls.

Example: async function get<T>(url: string): Promise<T> { const r = await fetch(url) return r.json() as T }

class Stack<T> { push(x: T) {} }: Generic class.

Example: class Queue<T> { items: T[] = [] push(x: T) { this.items.push(x) } }

function f<T = string>(x: T): Default type parameter.

Example: function makeId<T = string>(seed: T): string { return String(seed) }

Union & Intersection Types

type A = string | number: Union: value is one of these.

Example: let input: string | number

if (typeof x === "string"): Narrow a union with typeof.

Example: function f(x: string | number) { if (typeof x === "string") return x.toUpperCase() return x.toFixed(2) }

"key" in obj: Narrow with the in operator: property presence.

Example: if ("wheels" in vehicle) { vehicle.wheels }

if (Array.isArray(x)): Narrow arrays vs single values.

Example: function f(x: string | string[]) { const items = Array.isArray(x) ? x : [x] }

interface Circle { kind: "circle"; radius: number }
interface Square { kind: "square"; size: number }

: Discriminated union: each member has a literal tag.

Example: type Shape = Circle | Square function area(s: Shape) { switch (s.kind) { case "circle": return Math.PI * s.radius ** 2 case "square": return s.size ** 2 } }

type Admin = User & { role: "admin" }: Intersection: combine types into one.

Example: type SuperUser = User & { permissions: string[] }

const exhaustive: never = x: Never: exhaustiveness check; compiler errors on unhandled cases.

Example: function assertNever(x: never): never { throw new Error("unhandled: " + x) }

Utility Types

Partial<User>: All properties optional: update payloads.

Example: function update(id: number, patch: Partial<User>) { }

Required<User>: All properties required.

Example: function create(u: Required<PartialUser>) { }

Pick<User, "id" | "name">: Select specific properties.

Example: type PublicUser = Pick<User, "id" | "name">

Omit<User, "password">: Remove specific properties.

Example: type SafeUser = Omit<User, "password" | "token">

Readonly<User>: All properties readonly: frozen configs.

Example: type ImmutableConfig = Readonly<Config>

Record<string, number>: Object map type: keys to values.

Example: const counts: Record<string, number> = {}

ReturnType<typeof fn>: A function's return type: derive without rewriting.

Example: type Fetched = ReturnType<typeof fetchData>

Parameters<typeof fn>: A function's parameter tuple.

Example: type Args = Parameters<typeof update>[0]

Exclude<"a" | "b" | "c", "a">: Remove members from a union.

Example: type WithoutAdmin = Exclude<Role, "admin">

Extract<"a" | "b", "a" | "c">: Keep only intersecting members.

Example: type Common = Extract<RoleA, RoleB>

NonNullable<T>: Strip null and undefined.

Example: const host: NonNullable<string | null> = getHost()

Awaited<Promise<T>>: Unwrap promise types: async helper types.

Example: type Data = Awaited<ReturnType<typeof load>>

string | number extends `${infer U}` ? U : never: Template literal types: derive from string patterns (advanced).

Example: type Endpoint = `api/v${number}/${string}`

Functions & Classes

function f(a: number, b?: string): boolean: Typed signature: optional param and return type.

Example: function retry(n: number, delayMs?: number): boolean { ... }

const f = (x: number): number => x * 2: Typed arrow function.

Example: const double = (n: number): number => n * 2

function f(...rest: string[]): void: Typed rest parameters.

Example: function log(...lines: string[]): void { console.log(lines.join("\n")) }

function f(x: number): number | undefined: Union return: may fail gracefully.

Example: function findId(name: string): number | undefined { ... }

class User {
  constructor(private name: string) {}
}

: Parameter properties: shorthand for private fields.

Example: class Api { constructor(private baseUrl: string, private key: string) {} }

class User {
  private secret = ""
  protected role = "user"
  public name = ""
}

: Access modifiers: private, protected, public.

Example: class Account { private balance = 0 public deposit(n: number) { this.balance += n } }

class User {
  static create(): User { return new User() }
}

: Static members: factories and singletons.

Example: class Config { private static instance: Config static get(): Config { return this.instance ??= new Config() } }

class A implements B { }: Implement an interface: contract enforcement.

Example: class JsonRepo implements Repository<User> { ... }

class Dog extends Animal {
  constructor() { super() }
}

: Class inheritance with super call.

Example: class AdminUser extends User { constructor(name: string) { super(name) } }

abstract class Shape { abstract area(): number }: Abstract class: blueprint with abstract methods.

Example: abstract class Parser { abstract parse(raw: string): unknown }

Advanced Patterns

satisfies: Check a value against a type WITHOUT widening it: keeps literal types.

Example: const routes = { home: "/", user: (id: number) => `/u/${id}`, } satisfies Record<string, string | ((id: number) => string)>

as const: Freeze literals: readonly tuple/object literal types.

Example: const COLORS = ["red", "green"] as const type Color = typeof COLORS[number]

type Keys = keyof typeof obj: Keyof: keys of an object type as a union.

Example: type ConfigKey = keyof typeof config

type V = T[K]: Indexed access type: the type of a property.

Example: type Name = User["name"]

type Mapped = { [K in keyof T]: boolean }: Mapped types: transform every property.

Example: type Flags<T> = { [K in keyof T]: boolean }

function f<T extends object>(obj: T): T & { saved: true }: Intersection return: augment what you return.

Example: function persist<T extends { id: number }>(obj: T): T & { persistedAt: Date } { ... }

declare module "*.css" { const css: string; export default css }: Module declaration: type ambient modules.

Example: declare module "*.png" { const src: string export default src }

declare global {
  interface Window { gtag?: (a: string, b: unknown) => void }
}

: Augment global types: extend Window, NodeJS.ProcessEnv.

Example: declare global { namespace NodeJS { interface ProcessEnv { OPENAI_KEY?: string } } }

import type { User } from "./types": Type-only import: erased at compile time, no runtime cycle.

Example: import type { ApiResponse } from "./api"

type Narrow<T> = T extends string ? "str" : "other": Conditional types: choose a type based on another.

Example: type IsString<T> = T extends string ? true : false

Frequently asked questions

What is the difference between interface and type?

Interfaces can be merged and extended, and are preferred for object shapes and public APIs. Type aliases handle unions, intersections, tuples, and mapped types. Modern guidance: interface for objects, type for everything else.

How do generics work?

Generics parameterize types: function identity<T>(x: T): T captures the caller type at each call site. They build reusable components like Array<T> and Promise<T> while keeping full type safety.

What are union and intersection types?

A union (A | B) means a value can be A or B: narrow it with typeof, in, or discriminated union checks. An intersection (A & B) combines both types into one, used to merge config objects or mixins.

What are utility types used for?

Utility types transform existing types: Partial makes all properties optional, Pick/omit select fields, Record builds object maps, ReturnType extracts a function return type, and Exclude/Extract filter unions.