CODEWITHSUNDEEP
typescripttype-conversiondiscriminated-union
Maroš Beťko
Maroš Beťko

Reputation: 2329

Narrow return type of find from discriminated union array

I often use code like in example below and was wondering if there is some smart way to type the find results without having to do explicit type assertion.

type Foo = { type: "Foo" };
type Goo = { type: "Goo" };
type Union = Foo | Goo;

const arr: Union[] = [];
const foo = arr.find(a => a.type === "Foo") as Foo;

If the as Foo type assertion is left out, the result is of type Union even though it can only return type Foo.

What's the cleanest way of fixing the type of find to return the narrowed type in examples like these?

Edit: This problem could be also applicable to filter and other similar methods.

Edit2: Suggested similar question's accepted answer (Way to tell TypeScript compiler Array.prototype.filter removes certain types from an array?) shows that by using type guard in the predicate for find/filter the return value can be narrowed down.

How should this type guard function look to narrow down any discriminated union if e.g. the distinguishing string literal is always under type key?

Upvotes: 17

Views: 4783

Answers (7)

Joel
Joel

Reputation: 6243

Extension of @edzis and @SEG answers:

To narrow to a subset of types:

export function isOfType<
  Union extends { type: string },
  SpecificType extends Union['type'],
>(val: SpecificType[] | SpecificType) {
  return (obj: Union): obj is Extract<Union, { type: SpecificType }> =>
    Array.isArray(val) ? val.some((a) => a === obj.type) : obj.type === val;
}

Upvotes: 0

SEG
SEG

Reputation: 1715

To add autocomplete for the "types" (extension of @edzis answer)

export function isOfType<
  Union extends { type: string },
  SpecificType extends Union['type'],
>(val: SpecificType) {
  return (obj: Union): obj is Extract<Union, { type: SpecificType }> =>
    obj.type === val;
}


const found = arr.find(isOfType('Foo'));

Upvotes: 0

edzis
edzis

Reputation: 108

By now we can have it as a reasonably generic util:

export function isOfType<
  GenericType extends string,
  Union extends { type: GenericType },
  SpecificType extends GenericType,
>(val: SpecificType) {
  return (obj: Union): obj is Extract<Union, { type: SpecificType }> =>
    obj.type === val;
}

const found = arr.find(isOfType('Foo'));

Inspired by Trevor Dixon via https://stackoverflow.com/a/61102770

Upvotes: 4

mmmveggies
mmmveggies

Reputation: 146

Thank you to jcalz for the excellent accepted answer.

I have annotated a slightly different flavor of a factory for predicate guards:

function hasProp<K extends PropertyKey, V extends string | number | boolean>(k: K, v: V) {
  
  // All candidate types might have key `K` of any type
  type Candidate = Partial<Record<K, any>> | null | undefined

  // All matching subtypes of T must have key `K` equal value `V`
  type Match<T extends Candidate> = Extract<T, Record<K, V>>

  return <T extends Candidate>(obj: T): obj is Match<T> => (
    obj?.[k] === v
  )
}

Upvotes: 4

Trevor Dixon
Trevor Dixon

Reputation: 24342

The accepted answer is excellent, but it's hard to understand. I went with something like this. It's less reusable, only working on one type, but it's much easier to read.

function isType<V extends Union['type']>(val: V) {
  return (obj: Union):
      obj is Extract<Union, {type: V}> => obj.type === val;
}

const found = arr.find(isType('Foo'));

Upvotes: 8

Maroš Beťko
Maroš Beťko

Reputation: 2329

Here is the jcalz's code from answer above extended with the negation and union.

export function isDiscriminate<K extends PropertyKey, V extends string | number | boolean>(
    discriminantKey: K, discriminantValue: V | V[]
) {
    return <T extends Record<K, any>>(
        obj: T & Record<K, V extends T[K] ? T[K] : V>
    ): obj is Extract<T, Record<K, V>> =>
        Array.isArray(discriminantValue) 
            ? discriminantValue.some(v => obj[discriminantKey] === v)
            : obj[discriminantKey] === discriminantValue;
}

export function isNotDiscriminate<K extends PropertyKey, V extends string | number | boolean>(
    discriminantKey: K, discriminantValue: V | V[]
) {
    return <T extends Record<K, any>>(
        obj: T & Record<K, V extends T[K] ? T[K] : V>
    ): obj is Exclude<T, Record<K, V>> =>
        Array.isArray(discriminantValue)
            ? discriminantValue.some(v => obj[discriminantKey] === v)
            : obj[discriminantKey] === discriminantValue;
}

And usage:

type A = { type: "A" };
type B = { type: "B" };
type C = { type: "C" };
type Union = A | B | C;

const arr: Union[] = [];
arr.find(isDiscriminate("type", "A")); // A
arr.find(isDiscriminate("type", ["A", "B"])); // A | B
arr.find(isNotDiscriminate("type", "A")); // B | C
arr.find(isNotDiscriminate("type", ["A", "B"])) // C

Upvotes: 7

jcalz
jcalz

Reputation: 327859

If you want a generator for user-defined type guard functions returning a type predicate that discriminates discriminated unions, it might look something like this: 

function discriminate<K extends PropertyKey, V extends string | number | boolean>(
    discriminantKey: K, discriminantValue: V
) {
    return <T extends Record<K, any>>(
        obj: T & Record<K, V extends T[K] ? T[K] : V>
    ): obj is Extract<T, Record<K, V>> =>
        obj[discriminantKey] === discriminantValue;
}

If I call discriminate("type", "Foo"), the result is a function with a signature similar to <T>(obj: T)=>obj is Extract<T, {type: "Foo"}>. (I say it's similar because the actual return value restricts T to just types with "type" as a key and a value you can assign "Foo" to.) Let's see how it works:

const foo = arr.find(discriminate("type", "Foo")); // Foo | undefined 
const goos = arr.filter(discriminate("type", "Goo"));  // Goo[]

Looks good. And here's what happens if you pass inapplicable field/values:

const mistake1 = arr.find(discriminate("hype", "Foo")); // error!
// ------------------->   ~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Union is not assignable to Record<"hype", any>.
const mistake2 = arr.find(discriminate("type", "Hoo")); // error!
// ------------------->   ~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Union is not assignable to ((Foo | Goo) & Record<"type", "Hoo">)

Okay, hope that helps; good luck!

Link to code

Upvotes: 15

Related Questions