How the TypeScript NonNullable Type Works

The NonNullable
type is a utility type in TypeScript that creates a new type, whilst removing all null
or undefined
elements. It lets us take existing types, and modify them so they are more suitable in certain situations. Let's look at how it works.
Custom Types
This article covers custom types. To learn more about custom types, read my guide about it here.
NonNullable Utility Type
The NonNullable
utility type works a lot like other utility types, in that it can take an existing type, and modify it as you see fit. As an example, let's say we have a specific union type that accepts null
and undefined
as potential options:
type myType = string | number | null | undefined
This example works great in one example, but there is another part of our code where we don’t want to accept null
or undefined
. We could create a new type for that, or we could reuse myType
, using NonNullable
:
type myType = string | number | null | undefinedtype noNulls = NonNullable<myType>
In the above example, noNulls
is now of type string | number
.
In Plain English 🚀
Thank you for being a part of the In Plain English community! Before you go:
- Be sure to clap and follow the writer ️👏️️
- Follow us: X | LinkedIn | YouTube | Discord | Newsletter
- Visit our other platforms: CoFeed | Differ
- More content at PlainEnglish.io