'Writing a function that returns an array of type "without null" throws an error Type 'T' is not assignable to type 'NonNull'.(2322)

Following this answer, I have a function that removes null elements from an array (but not undefined):

// JavaScript
const dropNull = arr => {
    return arr.flatMap((f) => (f === null ? [] : f));
};

And now I want to use TypeScript to strictly define the types of the function's input and output:

  • input: any array
  • output: any array that doesn't contain null

This answer shows a very similar situation, but opposite to mine: whereas they want to allow null but restrict undefined, I want to restrict null and allow undefined. So inspired by the answer I did the reverse tweak:

type NonNull<T> = T extends null ? never : T[];

const dropNull = <T>(arr: T[]): NonNull<T>[] => {
    return arr.flatMap((f) => (f === null ? [] : f));
};

But as this REPL shows, I get an error:

Type 'T[]' is not assignable to type 'NonNull[]'.
Type 'T' is not assignable to type 'NonNull'.(2322)

Researching this error I've seen answers such as this one, but I couldn't figure out how to adopt it to my case.



Solution 1:[1]

It's hard for typescript to enforce returning a conditional type, because it's hard to know how your logic corresponds to that type. But I think you're over complicating it, and you can sidestep the issue entirely.

const dropNull = <T>(arr: (T | null)[]): T[] => {
    return arr.flatMap((f) => (f === null ? [] : f));
};

Here the generic parameter T is inferred as a type that does not contain null. And the argument is an array that can be filled with T or null.

Then you can simply return non null values from the array and typescript is happy.

const numsOrNull = [1,2,null] // (number | null)[]
const nums = dropNull(numsOrNull) // number[]

Playground

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alex Wayne