TypeScript functional destructuring not enforcing default type

Question

I have a function which accepts a single object parameter as follows. (Note, this is a contrived example but it demonstrates the problem.)

type FuncParams = { sayYes: boolean; }
type FuncType = (params: FuncParams) => string;

const maybeSayYes: FuncType = ({ sayYes }) => sayYes ? 'Yes' : 'No';

maybeSayYes({ sayYes: true }); // Returns 'Yes'
maybeSayYes({ sayYes: false }); // Returns 'No'

I want to make the sayYes property optional, so I updated the types as follows and added a default to the function declaration:

type FuncParams = { sayYes?: boolean; }
type FuncType = (params: FuncParams) => string;

const maybeSayYes: FuncType = ({ sayYes = true }) => sayYes ? 'Yes' : 'No';

maybeSayYes({ sayYes: true }); // Returns 'Yes'
maybeSayYes({ sayYes: false }); // Returns 'No'
maybeSayYes({}); // Returns 'Yes'

However, I noticed that I can assign any default value to sayYes and TypeScript doesn't flag up the incorrect type. For example:

const maybeSayYes: FuncType = ({ sayYes = 'notABoolean' }) => sayYes ? 'Yes' : 'No';

I expected TypeScript to infer the boolean type from FuncType and stop me assigning a string, but it doesn't.

I can get the error to show if I explicitly type the parameter as follows:

const maybeSayYes: FuncType = ({ sayYes = 'notABoolean' }: FuncParams) => sayYes ? 'Yes' : 'No';

However, I assumed TypeScript would infer this type from FuncType. I'm sure it's my understanding of TypeScript that's at fault, but I'd like to know:

Why TypeScript doesn't tell me that 'notABoolean' isn't a boolean.
How I can constrain the default value type without having to duplicate the FuncParams typing.

Reproduction on TS Playground

This is weird behavior; not sure if it's been reported before. The behavior is type safe (it's fine for function implementation to widen their parameter types), so it's not exactly wrong, but I don't see a use case for it. Still looking — jcalz
– jcalz, Commented Apr 23, 2021 at 14:41
Okay, it's microsoft/TypeScript#19127, this is working as intended. I guess they want a union here because without it, boolean gets messed up (as it's represented as true | false). — jcalz
– jcalz, Commented Apr 23, 2021 at 15:07

T.J. Crowder · Accepted Answer · 2021-04-23 16:00:07Z

3

I'm surprised by the behavior you describe, but my knowledge of TypeScript is still not very deep.

You can do it using a function overload type:

type FuncParams = { sayYes?: boolean; }
type FuncType = {
    (params: FuncParams): string;
    (params: FuncParams & {sayYes: never}): string; // Or just: {params: {sayYes: never}: any;
};

Then, a call that tries to use sayYes with a non-boolean type will match the second overload and cause an error. (Many thanks to jcalz for pointing out that sayYes can remain optional, and that you can use a simpler signature for he never overload.)

That gives you this behavior:

// Correct default value type
const maybeSayYes1: FuncType = ({ sayYes = true }) => sayYes ? 'Yes' : 'No';

// Incorrect default value type
const maybeSayYes2: FuncType = ({ sayYes = 'notABoolean' }) => sayYes ? 'Yes' : 'No';
//    ^−−−−−−−−−−−−− TypeScript compiler error here

// Correctly don't have it at all (since it's optional)
const maybeSayYes3: FuncType = ({ }) => Math.random() ? 'Yes' : 'No';

Playground link

edited Apr 23, 2021 at 16:00

answered Apr 23, 2021 at 9:59

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

petewritescode Over a year ago

Thanks, that makes sense. Although my minimal example only had one optional property, in reality I need multiple - is there any way to achieve this without a long list of overload types? I was hoping TS would interpret the fact that it's optional and essentially do this automatically.

T.J. Crowder Over a year ago

@petewritescode - I bet it's possible with mapped types and a generic type argument, but I don't immediately know how.

jcalz Over a year ago

BTW, this behavior, while surprising to me too, is apparently working as intended as per microsoft/TypeScript#19127.

jcalz Over a year ago

I don't quite get why the overload fixes it; overloads tend to cause other problems, so it's up to OP to decide if this is worth it. Anyway, I think you can keep FuncParams optional and just add the overload mentioning one of the optional properties and it will still work even if there are more optional properties. Like this code. But yeah, this whole thing is a weird one.

petewritescode Over a year ago

@T.J.Crowder Ok, thanks, I'm new here so wasn't sure what the etiquette was :) Thanks again!

|

Collectives™ on Stack Overflow

TypeScript functional destructuring not enforcing default type

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related