Strange Result of TypeScript `extends` Operator (Testing Types Assignability)

Question

I'm playing around with https://2ality.com/2020/06/computing-with-types.html#conditional-types to learn the type relationships in TypeScript.

Having defined the type function IsAssignableTo:

type IsAssignableTo<A, B> = A extends B ? true : false

I got the desired results like:

type MyGoodType1 = IsAssignableTo<42, Object>           // MyGoodType1 === true
type MyGoodType2 = IsAssignableTo<42, object>           // MyGoodType2 === false
type MyGoodType3 = IsAssignableTo<'foo', 'foo'|'bar'>   // MyGoodType3 === true

However, the result of reversing the parameters of the last expression:

type MyStrangeType = IsAssignableTo<'foo'|'bar', 'foo'> // MyStrangeType === boolean ???

is, to my surprise, neither literal true nor literal false (expecting it to be false), but a boolean?

My Questions are

How assignability for union types works in TS? I've read SPEC's Assignment Compatibility and got no luck.
How could the result of T1 extends T2 ? A : B become a union of A and B?

Complete Code in Playground

Ingo Bürk · Accepted Answer · 2021-07-29 04:44:19Z

1

Conditional types acting on generic arguments become distributive when given union types, i.e.,

IsAssignableTo<'foo' | 'bar', 'foo'> 
    = IsAssignableTo<'foo', 'foo'> | IsAssignableTo<'bar', 'foo'>
    = true | false
    = boolean

You can avoid that by wrapping your generic type into a one-tuple. Since the conditional is now no longer applied to a union, no distribution occurs:

type IsAssignableTo<A, B> = [A] extends [B] ? true : false;

You can also find this information in the handbook.

answered Jul 29, 2021 at 4:44

Ingo Bürk

20.2k7 gold badges72 silver badges103 bronze badges

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

Collectives™ on Stack Overflow

Strange Result of TypeScript `extends` Operator (Testing Types Assignability)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related