Infer is easier than you think

TypeScript's infer keyword is MUCH narrower, much less widely used than you think it is. It has ONE use case, and we cover it in a ridiculous amount of depth here.

Become a TypeScript Wizard with Matt's upcoming TypeScript Course:

Follow Matt on Twitter

[jeralm]

I already considered myself an advanced TypeScript dev, but a good understanding of infer was missing from my arsenal. Thank you so much for this.

[ivan_dramaliev]

To me, the most intuitive mental model for types (in TypeScript) is that of (mathematical) sets. 'never' is simply the empty set, 'any' is the set of everything, 'string' is the infinite set of all possible strings, while any particular string (e.g. 'abc') when used as a type is simply the set consisting of a single element that is that particular string, and so on. Generics act somewhat like functions at the level of the type system (with the types listed between < and > acting as the arguments), and the 'extends' and 'infer' operators are there for type pattern matching and extraction.

[DaveTheDeveloper]

The comparison with the replace-regex was awesome. Helped me alot to understand infer better! Thx Matt!

[codecleric]

Incredible. I grok'd the official docs explanation and it helped me understand some parts of a project codebase that I was struggling with before. But after watching this video, it's absolutely crystal clear and gives me much more context for how it can be used more broadly

[jasonstewart]

Very cleanly spoken. The mental model for 'infer' is super valuable. The comparison of 'extends' to a regex match and 'infer' to the capture group of the regex was what I was missing. It's so much easier to get my head around this after watching this video. Three cheers!

[prcodes]

I was happy and satisfied with the basic pattern matching mental model of infer, then you completely blew my mind when you went even deeper into infer black magic and completely demystified it. Well done!

[edgeeffect]

I'm a recent "convert" to your channel. There's a lot of (let's face it) simply awful programming tutorial channels on YouTube and it's such a rare treat to find one, like this, that's of really good quality. It's got to the stage now where you're knocking "Arjan Codes" of of my personal number 1 spot. Keep up the excellent work.

[MrMcFyfey]

Great explanation, thanks Matt! I've been trying to find some more advanced typescript tutorials for a while now

[samerkayali]

You just made infer so easy! it was a thing that I have struggle to understand until seeing this video! Matt thanks a lot! You are a true hero and TypeScript mage!

[윤지만-wm]

He explained everything in a very simple and easy to understand way. thank you

[holygl]

Thanks so much for this amazing video Matt!

You really helped me solidify my understanding of infer.

One thing I have been struggling with is inferring generic function parameters.

If you take this map function, T and U are inferred as unknown:

```ts
type MapFunction = <T, U>(mapper: (val: T) => U, list: T[]) => U[]
type MapParameters = Parameters<MapFunction> // [mapper: (val: unknown) => unknown, list: unknown[]]
```

This makes sense given T and U have no constraints.

If you added constraints such as `<T extends string, U extends number>` then the mapper `val` and `list` types would be of type `string` and the mapper return type would be of type `number`

However a mapping function should remain generic and what I really want/need here is:

```ts
type MapParameters = Parameters<MapFunction> // [mapper: (val: T) => U, list: T[]]
```

This would bind the relationship between the mapper val argument and the list type.

The relationship between the mapper val argument and the list are decoupled with the unknown type.

For arguments sake, let's say I defined PartialFunction type:

```ts
// Implementation 1
type PartialFunction1<F> = F extends (...args: infer A) => infer R
? (...args: Partial<A>) => R
: never

// Implementation 2
type PartialFunction2<F extends (...args: any[]) => any> = (
...args: Partial<Parameters<F>>
) => ReturnType<F>
```

Both of these PartialFunction types are the same (or so I believe) and both create the following type for the MapFunction defined above:

```ts
type PartialMap1 = PartialFunction1<MapFunction>
type PartialMap2 = PartialFunction2<MapFunction>

// PartialMap1 = (mapper?: ((val: unknown) => unknown) | undefined, list?: unknown[] | undefined) => unknown[]
// PartialMap2 = (mapper?: ((val: unknown) => unknown) | undefined, list?: unknown[] | undefined) => unknown[]
```

Since the params of the generic MapFunction are being inferred as unknown and then spread onto the new function, the generic constraint between the mapper function and the list is lost.

Is there anyway that you know of to solve for this or is this a current limitation of TypeScript?

Here's a link to TypeScript playground with the types shared above:

[BlueeyesChineseguy]

The regex analogue really helps paint the mental model, great video!

[peachesfruitella]

Liked the pairing with ‘never’ explanation, and how to think about its usage, felt like an aha moment 🎉

[darrenvong]

Even though I have an idea of what infer does, I still learnt something new from this (didn't know it's only applicable to conditional types)! Can't wait to dig into Total TypeScript more as you expand the content in that course!

[EddyVinck]

This is brilliantly explained. Thank you Matt! I got my employer to buy Total TypeScript for me, can't wait to dig in!

[NedCollyer]

Thanks. Perfect :) Infer was the missing piece of the puzzle for me. I sorta understood what it was doing, but the syntax was just a bit nuts with the all the "extends matching".

[ivaylopetrov]

Thank you very much for the channel Matt aka TS Wizard 🙏. Just want to mention that something about the starting explanation what is conditional type and basically constrain in TS. So I understand it as the construction 'A extends B' basically means A subset of B. From SetTheory in Maths. I saw that many people are replaying this part, including me.

Happy coding 💪

[ljuglampa]

You might be a TypeScript wizard, not sure, but I do know you're a educational wizard! Thank you for doing these ❤️

[kasperaamodt]

Genuinely thought I was subscribed until the shout out at the end, now I am! Great vid

[EpicNicks]

Came here after seeing the infer keyword in the ReturnType generic type definition wondering what this magic was.
Thanks for the explanation.