{"id":324,"date":"2026-06-13T13:03:18","date_gmt":"2026-06-13T13:03:18","guid":{"rendered":"https:\/\/abrarqasim.com\/blog\/typescript-utility-types-i-actually-use-and-the-ones-i-skip\/"},"modified":"2026-06-13T13:03:18","modified_gmt":"2026-06-13T13:03:18","slug":"typescript-utility-types-i-actually-use-and-the-ones-i-skip","status":"publish","type":"post","link":"https:\/\/abrarqasim.com\/blog\/typescript-utility-types-i-actually-use-and-the-ones-i-skip\/","title":{"rendered":"TypeScript Utility Types I Actually Use (And the Ones I Skip)"},"content":{"rendered":"

Confession: for about two years I maintained a file called types\/user-inputs.ts<\/code> that was just the User<\/code> interface copied four times with small edits. CreateUserInput<\/code>. UpdateUserInput<\/code>. PublicUser<\/code>. UserPreview<\/code>. Every time the real User<\/code> grew a field, I’d update it and then forget at least one of the copies. The bug would surface weeks later, three layers away, as an API response missing a field that the compiler swore was fine.<\/p>\n

The fix had been sitting in the language the whole time. TypeScript utility types take one source-of-truth type and derive the variants, so when the source changes, the variants follow. I knew they existed. I’d just filed them under “fancy type-level stuff I’ll learn later,” next to conditional types and whatever infer<\/code> does.<\/p>\n

This post is the tour I wish someone had given me: the utility types I now use weekly, the hand-rolled junk they replaced, and the clever ones I tried and quietly backed out of.<\/p>\n

What utility types actually are<\/h2>\n

Nothing magic. They’re mapped and conditional types that ship with the compiler, documented on one page of the official handbook<\/a>. You could write most of them yourself in a line or two. The value isn’t sophistication, it’s that they’re standard: every TypeScript developer who reads Partial<User><\/code> knows instantly what it means, and nobody has to review your homemade MakeOptional<T><\/code> for correctness.<\/p>\n

That standardization argument is what finally sold me. My hand-rolled versions weren’t wrong. They were just one more thing for the next person to read, doubt, and re-verify.<\/p>\n

Partial, Pick and Omit do most of the work<\/h2>\n

Here’s the duplicated-interface mess I used to write:<\/p>\n

interface User {\n  id: string;\n  email: string;\n  name: string;\n  passwordHash: string;\n  createdAt: Date;\n}\n\n\/\/ the drift-prone copies\ninterface UpdateUserInput {\n  email?: string;\n  name?: string;\n}\n\ninterface PublicUser {\n  id: string;\n  email: string;\n  name: string;\n  createdAt: Date;\n}\n<\/code><\/pre>\n
And the derived version that replaced it:<\/p>\n
type UpdateUserInput = Partial<Pick<User, "email" | "name">>;\ntype PublicUser = Omit<User, "passwordHash">;\n<\/code><\/pre>\n
Two lines, and they can’t drift. Add a field to User<\/code> and PublicUser<\/code> picks it up on the next compile. Rename passwordHash<\/code> and the Omit<\/code> breaks loudly instead of leaking quietly.<\/p>\n
A warning about Partial<\/code> before you spray it everywhere, because I did and regretted it. Partial<User><\/code> makes every field optional, including ones your update logic actually requires. My update endpoint happily accepted {}<\/code> for months. Nothing crashed. It just did nothing, successfully, with a 200 status. The pattern that fixed it: keep Partial<\/code> for the fields that are legitimately optional and intersect the required ones back in.<\/p>\n
type UpdateUserInput = Partial<Pick<User, "email" | "name">> & {\n  id: string; \/\/ you can't update nothing and nobody\n};\n<\/code><\/pre>\n
Partial<\/code> is a scalpel. Used on a narrow Pick<\/code>, it’s precise. Used on a whole entity, it tells the compiler “anything goes,” and the compiler believes you.<\/p>\n
One habit worth stealing: prefer Pick<\/code> over Omit<\/code> for anything security-adjacent. Omit<\/code> is a denylist. If someone adds a resetToken<\/code> field to User<\/code> next quarter, Omit<User, \"passwordHash\"><\/code> will happily include it in your public type. Pick<\/code> is an allowlist, so new fields stay private until you opt them in. I learned that one the embarrassing way, though thankfully in a code review rather than an incident report.<\/p>\n
Record, and the index signature it replaced<\/h2>\n
I used to type lookup objects like this:<\/p>\n
const statusColors: { [key: string]: string } = {\n  active: "green",\n  suspended: "amber",\n  deleted: "red",\n};\n<\/code><\/pre>\n
The index signature accepts any string, which means statusColors.actve<\/code> compiles fine and returns undefined<\/code> at runtime. The Record<\/code> version closes that hole:<\/p>\n
type Status = "active" | "suspended" | "deleted";\n\nconst statusColors: Record<Status, string> = {\n  active: "green",\n  suspended: "amber",\n  deleted: "red",\n};\n<\/code><\/pre>\n
Now a typo’d key is a compile error, and so is a missing one. Add \"banned\"<\/code> to the Status<\/code> union and the compiler walks you to every lookup table that needs the new entry. It turns “did I update everything?” from a memory exercise into a build failure, and my memory loses that contest often enough that I’ll take the trade every time.<\/p>\n
ReturnType and Awaited, for code you don’t control<\/h2>\n
The workhorses above shine on your own types. This pair shines on everyone else’s. Some library exports a function but not the type of what it returns. Old me would reconstruct that shape by hand, fifteen lines of interface transcribed from dumped output, stale the moment the library updated.<\/p>\n
\/\/ the type the library never exported\ntype Session = Awaited<ReturnType<typeof auth.getSession>>;\n<\/code><\/pre>\n
ReturnType<\/code> extracts what the function returns, Awaited<\/code> unwraps the promise, and the result tracks the library exactly. When the package updates and the shape changes, my code breaks at compile time instead of in production. I use the same trick on my own database query helpers, where the row shape lives in one query function and everything downstream derives from it.<\/p>\n
Parameters<\/code> is the same idea pointed at inputs, and it quietly cleaned up my test files. I had test helpers that re-declared a service function’s argument types, which meant every signature change broke the tests in the dumbest possible way: not because behavior changed, but because the helper’s copy of the types went stale.<\/p>\n
function buildOrderArgs(\n  overrides: Partial<Parameters<typeof createOrder>[0]> = {}\n) {\n  return { customerId: "test-1", items: [], ...overrides };\n}\n<\/code><\/pre>\n
Now the helper’s types are the function’s types. Change createOrder<\/code> and the helpers either keep working or fail at the exact line that needs attention. My test maintenance time on that service dropped enough that I went back and did the same thing to two other projects the same week. I wrote about a related habit in my satisfies post<\/a>, and the theme is the same: stop telling the compiler things it already knows.<\/p>\n
The ones I tried and put back<\/h2>\n
Honesty section. Not every utility type earned a spot.<\/p>\n
Capitalize<\/code>, Uncapitalize<\/code> and the string-manipulation family are impressive and I have used them exactly once outside of a toy, generating event-handler names from event names. The type errors they produce when something goes wrong are genuinely hard to read, and a junior teammate lost an afternoon to one of mine. If a plain union written out by hand costs me ten keystrokes and saves the next person that afternoon, the union wins.<\/p>\n
NoInfer<\/code>, added in TypeScript 5.4<\/a>, solves a real inference problem in generic function signatures. If you maintain a library, learn it. In application code I’ve needed it maybe twice, and both times rearranging my function arguments solved the same problem more legibly.<\/p>\n
Deeply nested Omit<Pick<Partial<...>>><\/code> chains are the type-level version of clever one-liners. When I find myself three utilities deep, that’s usually the type telling me the underlying model is wrong, and the fix belongs in the data design, not the type gymnastics. The same instinct applies to generics, which I covered in what I actually reach for with TypeScript generics<\/a>: the cleverness budget is real and it’s smaller than you think.<\/p>\n
Something to try this week<\/h2>\n
Grep your codebase for interfaces that share three or more field names with another interface. Each cluster is a candidate for one source type plus Pick<\/code>, Omit<\/code> or Partial<\/code> derivations. Convert one cluster, then add a field to the source type and watch where the compiler takes you. That single compile error tour usually converts people faster than any blog post, including this one.<\/p>\n
I do this audit early on most client projects I take on<\/a>, and it’s reliably the cheapest win in the codebase: no runtime change, no new dependency, just deleting copies that were waiting to drift.<\/p>\n","protected":false},"excerpt":{"rendered":"
Six TypeScript utility types that earn their keep in production, the hand-rolled types they replaced, and the clever ones I stopped using. Real code included.<\/p>\n","protected":false},"author":2,"featured_media":323,"comment_status":"","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"","rank_math_description":"Six TypeScript utility types that earn their keep in production, the hand-rolled types they replaced, and the clever ones I stopped using. Real code included.","rank_math_focus_keyword":"typescript utility types","rank_math_canonical_url":"","rank_math_robots":"","footnotes":""},"categories":[45],"tags":[38,44,367,63,366],"class_list":["post-324","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programming","tag-frontend","tag-javascript","tag-type-safety-2","tag-typescript","tag-typescript-utility-types"],"_links":{"self":[{"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/posts\/324","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/comments?post=324"}],"version-history":[{"count":0,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/posts\/324\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/media\/323"}],"wp:attachment":[{"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/media?parent=324"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/categories?post=324"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abrarqasim.com\/blog\/wp-json\/wp\/v2\/tags?post=324"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}