Generics: The most intimidating TypeScript feature

Generics are a huge reason why TypeScript is SO DARN POWERFUL. Letting you create types from other types, pass types to functions, and even INFER those types without you needing to specify them.

They're pretty advanced, though - so if you want to learn more advanced TypeScript, time to strap in.

Become a TypeScript Wizard with Matt's TypeScript Course:

Follow Matt on Twitter

00:00 Intro
00:36 Generics on the type level
01:45 Passing type arguments to functions
03:06 Passing type arguments to Set
04:21 Inferring the types
05:55 Constraints on type arguments
08:19 Constraints in functions
10:07 Sometimes 'as' is fine
11:23 Multiple type arguments
14:05 Defaults in type arguments
15:00 Integrating with third-party libraries
17:26 Outro

[DjokovicAirlines]

Matt, you are the Wizard. I can't describe how helpful this video was for me. It's purely golden. Thank you for your work!

[Deliverant]

Please never stop doing these videos, you're my inspiration

[nikostsakas]

The stuff about apis is golden, I recently did a similar thing to stop typing JSON responses as 'any' and it really helped with leveraging Typescript to handle edge cases etc. I haven't used schema validation yet, but seeing how clean the code is, it's really enticing.

[shivamjhaa]

This is actually really awesome. The light bulb moment for me was "Take generic from inward to outward": as in, generics can be inferred from the arguments passed to a function. This is very poweful

[stonecoldcold]

One of the best videos out there on Typescript Generics!

[TeaBroski]

Thanks for sharing, great tips and I didn't know much about generic types.
I just fear huge overheads, especially in the code readability department. When these types of codebases are written in real world scenarios, things turn pretty ugly pretty quickly.
And usually, when the wizard who wrote this dark spells on a magic mushroom microdose induced flow state goes for the better paying company, the rest of people is left scrambling in chaos.
Sometimes, especially for large companies with mixed teams, it's ok to be a bit verbose and repetitive if it leads to faster handovers and a better overall team experience.
That said, we (as the JS community) need to mature towards more advanced design patterns.
Was great learning about generic types today, thanks for sharing!

[emiletremblay]

that's it im sold. Subbing to this gold channel

[ori_geva]

Hey Matt, your videos are very helpful, you're covering features in TypeScript I needed and didn't know exist.
It'd be so great if you could give and example of a scenario before explaining a TS solution, for the more complicated ones.
Leaving out inline object types (like { firstName: string, lastName: string } would be nice too just so there's less to process heh.

[concisedeveloper]

10:07 To get the proper return type of your function, instead of type assertion, you can add it as return type to the function:

const typeObjectKeys = <TObj extends {}>(obj:TObj):Array<keyof TObj> =>{
return Object.keys(obj)
}
This would result in the perfectly valid error of "Type 'string' is not assignable to type 'never'", since empty arrays can be passed to it. Since keyof keeps the original type but Object.keys returns strings, this can cause runtime errors.

The proper implementation would assure that only objects with valid keys can be accepted by the function:

const typeObjectKeys = <TObj extends Record<string, any>>(obj:TObj):Array<keyof TObj> =>{
return Object.keys(obj)
}

[brangtoggez]

I love you Matt, free contents that you produced are chef kisses. I am always craving for more.

[FLLENDRK]

Brilliant video, learnt a lot - I've never really looked into generics before, so, now my Typescript knowledge really has gone up a level.

[Ageofzetta]

Straight to bookmarks.
You're an amazing teacher!!

[BlurryBit]

The most helpful video I have seen for a while. :)
Adding to bookmark for using as a documentation.

[eulucascampelo]

14:03 is the better part of this video 😁

[artless-soul]

Thank you Matt for all this great content! May be consider slowing down a bit so we get time to grasp the content and avoid head spinning injury by having to rerun videos/ play at lower speed with robot voice 😀

[jonatanferenczfi]

Great video. Not many new things for me. But it's really good to see someone making truly advanced topic videos on TS.
Keep it up 🚀

[KhalilCodes]

Hey Matt,
I've been following you on X for sometimes and learned a lot from about TS.
And here as well.... Subscribed 😍

[io]

Coincidentally, I just watched your generics video on LWJ and was doing those exercises. This is a great video. Lot of things clicked for me with generics! Thanks Matt!

[JulianHarris]

Outstanding. Last time I used generics was C++ and Java in the late 90s probably before most of the other commenters were born😂 and it’s really great to see the inference capabilities to avoid “type stuttering” you otherwise get.

[brandonz]

This video singlehandedly dissolved my fear of "complicated" typescript. I'm pretty new to it, but now I want to use generics everywhere