Capítulo 6 de 36

Chapter 6: Type Manipulation Overview, keyof and typeof

Core Idea

TypeScript's "Type Manipulation" section (generics, keyof, typeof, indexed access, conditional types, mapped types, template literal types) is the toolbox for deriving new types from existing types/values instead of writing every type by hand — keyof and typeof are the two smallest, most foundational operators in that toolbox.

Key Concepts

  • The Type Manipulation toolbox (covered across this and the next several chapters): Generics (parametrized types), keyof (object type → union of its keys), typeof (value/variable → its type), Indexed Access Types (Type['a']), Conditional Types (type-level if), Mapped Types (transform every property of a type), Template Literal Types (mapped types over string literals).
  • keyof T: produces a string/number literal union of T's keys. keyof { x: number; y: number } is "x" | "y".
  • keyof on an index signature returns the index's key type instead of literal property names — a { [n: number]: unknown } gives keyof = number, but a { [k: string]: boolean } gives keyof = string | number (not just string), because JS always coerces object keys to strings under the hood, so a numeric index is implicitly also a string index.
  • typeof in a type position: distinct from JS's runtime typeof operator — typeof someVariable as a type refers to that variable's inferred type, not the string "object"/"string"/etc. Most useful combined with other operators, e.g. ReturnType<typeof f> to get a named function's return type (you can't pass a function name directly to ReturnType<T>f the value and the type of f are different things; typeof f bridges that gap).
  • typeof's scope is deliberately narrow: only legal on identifiers and their property accesses — not arbitrary expressions — specifically to prevent code that looks like it's calling a function (typeof msgbox("...")) from being silently misread as a type expression instead of an executed call.

Code Examples

function f() {
  return { x: 10, y: 3 };
}
type P = ReturnType<typeof f>; // { x: number; y: number }
  • What it demonstrates: typeof bridging a runtime value (f) into a type-level expression so a utility type (ReturnType) can operate on it — ReturnType<f> alone is a type error because f names a value, not a type.

Reference Tables

OperatorInputOutput
keyof Tobject typeunion of key names (or index key type)
typeof xa variable/property identifierthe type of that value

Key Takeaways

  1. keyof and typeof are rarely useful alone — their value comes from feeding their output into generics, mapped types, or utility types like ReturnType<T>/Parameters<T>.
  2. Reach for typeof someValue any time you want a type to track a value's shape instead of duplicating it by hand — keeps the type and the implementation from drifting apart.
  3. typeof's restriction to identifiers/property paths is a safety rail, not an arbitrary limitation — it stops "looks like a call, is actually dead type syntax" bugs.

Connects To

  • Generics: the next step up in expressiveness — parametrized types that keyof/typeof outputs often feed into.
  • Mapped Types: keyof T is the standard way to iterate a type's keys in a mapped type ({ [K in keyof T]: ... }).
  • Indexed Access Types: combines with keyof to pull individual property types out of an object type.
  • Utility Types (Reference): ReturnType<T>, Parameters<T>, and friends are all built from typeof + these operators.