DEV Community

Cover image for Prerequisite to understanding TypeScript Omit in React TypeScript Cheatsheet
Sung M. Kim
Sung M. Kim

Posted on • Originally published at sung.codes on

6 4

Prerequisite to understanding TypeScript Omit in React TypeScript Cheatsheet

Introduction

A note to self lest I forget the resources I learned from.

As I was going thru Swyx's React TypeScript Cheatsheet, Props: Omit prop from a type, I had trouble understand the definition of Omit.

// this comes inbuilt with TS 3.5
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>

Could not wrap my heads around it so Googled and found Marius Schulz's blog posts.

Blog read order

I read these backwards initially but the posts in following order seems to make sense.

  1. keyof and Lookup Types in TypeScript - Learn about keyof used for Omit and Exclude
  2. Conditional Types in TypeScript - To understand Exclude
   type Exclude<T, U> = T extends U ? never : T
  1. The Omit Helper Type in TypeScript - To finally learn how Omit is implemented

References

Advaned utlity type document and sources for

  1. Omit<Type, Keys>
   /**
    * Construct a type with the properties of T except for those in type K.
    */
   type Omit<T, K extends keyof any> = Pick<T, Exclude<keyof T, K>>
  1. Pick<Type, Keys>
   /**
    * From T, pick a set of properties whose keys are in the union K
    */
   type Pick<T, K extends keyof T> = {
     [P in K]: T[P]
   }
  1. Exclude<Type, ExcludedUnion>
   /**
    * Exclude from T those types that are assignable to U
    */
   type Exclude<T, U> = T extends U ? never : T

Misc. Link

Need to watch Marius Schulz's Egghead course, Advanced Static Types in TypeScript.


Image by Edward Lich from Pixabay

cuz, Donut's hole reminds me of Omit 😉

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay