TypeScript's Omit, explained

Written by Rico Sta. Cruz
(@rstacruz) · 1 June 2021

The TypeScript helper called Omit is really useful! It will remove fields from a given object type. It’s useful in making subsets of an object type.

interface Book {
  author: string;
  isbn: string;
  title: string;
}

type SimpleBook = Omit<Book, 'author'>;
// => { isbn: string; title: string; };

Multiple fields

What if we want to omit more fields? Omit can take away more fields by joining many fields with a union type. Here it is removing two fields.

interface Book {
  author: string;
  isbn: string;
  title: string;
}

type IsbnOnlyBook = Omit<Book, 'author' | 'title'>;
// => { isbn: string; };

Using with generics

🤔 What if we want to reuse Omit on many things, not just books? — We can use a generic type that we can reuse on types other than Book. How about with a Tweet, for example:

interface Book {
  author: string;
  isbn: string;
  title: string;
}
interface Tweet {
  author: string;
  body: string;
}

type NoAuthor<T> = Omit<T, 'author'>;

type AnonymousBook = NoAuthor<Book>;
// => { isbn: string; title: string; }
type AnonymousTweet = NoAuthor<Tweet>;
// => { body: string; }

Pick: the opposite of Omit

The opposite of Omit is Pick, which removes all fields except the ones you want.

interface Book {
  author: string;
  isbn: string;
  title: string;
}

type AuthorOnly = Pick<Book, 'author'>
// => { author: string; }

type WithoutAuthor = Omit<Book, 'author'>
// => { isbn: string; title: string; }

type TitleAndAuthorOnly = Pick<Book, 'title' | 'author'>
// => { title: string; author: string; }

Written by Rico Sta. Cruz

I am a web developer helping make the world a better place through JavaScript, Ruby, and UI design. I write articles like these often. If you'd like to stay in touch, subscribe to my list.