How can I extend an interface and override a property's type?

Viewed 14965

I have a pretty complicated object with multiple properties that I'd like to extend and override a specific property.

interface ComplicatedObject {
  propertyOne: string,
  propertyTwo: null
}

interface MoreComplicatedObject extends ComplicatedObject {
  propertyTwo: string
}

Essentially, objects with the type ComplicatedObject are converted to the MoreComplicatedType by assigning a string value to propertyTwo. I'd like to avoid using a union type on propertyTwo because all calls using propertyTwo assume that it's a string, not a null value, so I'd rather not have to include type checks in every instance where I access propertyTwo.

How can I extend an interface and override the type of an existing property?

3 Answers

You can make use of Omit<T, K>, which allows you to omit certain keys of a type. You can then use & to append the keys you want.

type A = {a: string, b: string}
type B = Omit<A, 'b'> & {b: number}

Note that you can declare A as an interface, Omit<T,K> similarly works.

Playground Link

Using the type-fest npm package, you can use the Merge helper to overwrite/override any property on the original, however you like:

import {Merge} from 'type-fest'

type ComplicatedObject = {
  propertyOne: string,
  propertyTwo: null
}

type MoreComplicatedObject = Merge<ComplicatedObject, {
  propertyTwo: string
}>

This may work with interfaces too, but I've only used it with object types.

Related