Should almost name it "TypeScript Utility Types in ", my god what this video has explained in such a short amount of time is incredible. Love the short format stuff
Yes, I had to use `type StartOfUnitType = Parameters[0];` because standard Dayjs has a type for 'startOf' but when you add additional plugins, those plugins add additional TS types to the startOf function to make it more useful.. And it be type aware, but what they didn't do was add those additional types in an exportable way that we could reference.. So. jad to do this so our wrapper class could also reference the known types for startOf.
love making my own utility types, like combining Pick, Omit and Partial to create SemiPartial and SemiRequired. Here's a free one for tuples: type FixedLengthTuple = L extends 0 ? never[] : Array & { 0: T, length: number }
I wish there was a plugin for my IDE that would look at what I'm doing and say "There's a built-in utility type that does this, you should use it". Because I forget about some of these
High quality content. I keep hearing Theo talk about letting TS infer as much as possible for scalability. Would love your take on it considering all the benefits you showcase of explicit typing.
Absolutely - using a utility type lets you _transform_ an existing type instead of redeclaring it. For instance, UserWithoutId can be Omit. Inference helps keep your code DRY. This is just another kind of inference.
TIL about the `-readonly` trick to make properties mutable. Cursed syntax? Yes. Black magic? Yes. Shows decoupling between typing and runtime (Object.freeze)? Definitely: a frozen object, even marked as mutable, won't be allowed to be modified at runtime.
Awaited correctly emulates the await keyword, which itself also recursively checks if a result in thenable (aka has a then method with compatible call signature) and uses that wait on anything PromiseLike (yes that's a type TS knows too)
@@Mitsunee_ Yep, I always use PromiseLike when I am accepting a Promise as a parameter or returning the value of a method call, Except for an async function I will return an actual Promise
Thank you for taking the time to make these available - Sadly I missed the value of the Extract - it wasn't clear what it returned as you didn't hover over the type that was created.
Wanna mention to anybody who wanna use or is using Excludes or Extracts, they're not type safety(so you can misstypo and rip), if we will try to extract something that doesn't exist or exclude we wont be notified by highlighting in editor and when i was working on my package with types i didnt know why it wasnt type safety, but then i realized why after hovering on extract and excludes. Theyre both the same, but condition is opposite, so i have made my own ones that are type safe by extending etc and they looks like this: *type TypeSafeExtract = T extends U ? T : never;* *type TypeSafeExclude = T extends U ? never : T;* Theyre literally doing the same, but theyre type safe, so if we're trying to do extracts or excludes like this: *type SomeUnion = "hey" | "hello" | "hi"* *type CoolType = Extract* - in this case we wont get highlights that "something" doesnt exist, but by using the type that i have made the same way what normal extract or excludes we re getting type safety Maybe theres a way in tsconfig to make them type safe, but couldnt find anything about it and my mate told me that its not type safe
2:12 You missed the primary use case: To help support developers using commonjs `export =` syntax. You can only export one type in that case. This really helps devs who are gradually typing a commonjs package with `module.exports =` everywhere.
This was an awesome summary! I'm interested to learn how to use utility classes with generic types. For example, if your function took a callback and you want the return type to be the result of that callback function. function cachedRequest (callback: F, key: string): ReturnType { ... } Sorry that is probably gibberish but hope that gets at the idea of what I want to do
this works as long as you constrain type F to what ReturnType expects, the following signature works as you requested: function cachedRequest any> (callback: F, key: string): ReturnType { ... }
Does typescript include helper functions which perform the runtime transformation of objects which mimic / match the utility types? For example, for Omit is there a similar function '_omit' from something like tslib? I think most people would use destructuring to achieve this for a simple object, but for complex nested objects it might be tricky.
what if I have one required prop in object and rest are dynamic ones? I tried this one: export interface Route { path: string; [subRoute: string]: Route; } But it gives an error: "Property 'path' of type 'string' is not assignable to 'string' index type 'Route'". How can I solve this? I need to have subRoute exactly typeof Route. I can add union like this "Route | string" but it breaks the idea of this object
@@mattpocockuk now when I create object like this one: export const ROUTES: Record = { home: { path: '/', }, services: { path: '/services', }, about: { path: '/about', }, features: { path: '/features', }, events: { path: '/events', event: { path: '/events/:id', } }, } It gives the error: "Type '{ path: string; }' is not assignable to type 'Route'. Type '{ path: string; }' is not assignable to type '{ [subRoute: string]: Route; }'. Property 'path' is incompatible with index signature. Type 'string' is not assignable to type 'Route'."
Maybe the most insightful 3 minutes of TypeScript in my life
Amen
Truth. Great video!
True, although more like ten minutes because of all the times I had to pause and rewind.
I don't know why you have so few views, the videos are pure gold
I learned about utilities like 5 months ago and man… whoever keeps creating this stuff, good shit
These videos are gold and especially bullshitless. Other RUclipsrs often convey the same amount of information in a 15 minutes tutorial.
The whole time I was watching this I kept saying "ohhhh my god" - absolutely unreal video
quickly becoming my favorite "programming tutorial" genre channel. The value to time ratio is insane
u da best, no blah blah like other videos, just straight to the point with examples
Really awesome 👍🏻
Matt, you are the real Wizard of TS .... \,,/
Matt, your content are straight on the point and i learn more in a less time. Thank you
Nice one, I didn‘t know about Extract and NonNullable
I liked your tweet about them being the "gateway drug" to type level programming!
Should almost name it "TypeScript Utility Types in ", my god what this video has explained in such a short amount of time is incredible. Love the short format stuff
Never looked back when I first came across TypeScript.
those tips about getting parameters and return types from external libraries is great.
Yes, I had to use `type StartOfUnitType = Parameters[0];` because standard Dayjs has a type for 'startOf' but when you add additional plugins, those plugins add additional TS types to the startOf function to make it more useful.. And it be type aware, but what they didn't do was add those additional types in an exportable way that we could reference.. So. jad to do this so our wrapper class could also reference the known types for startOf.
The last example is what I literally did yesterday, but I didn't know any of this and I had to search for it. Thanks for the awesome video
cant belive yuure a music teacher and now youre a programming teacher, life.... is so funny
You're telling me
Woah, next level video!
love making my own utility types, like combining Pick, Omit and Partial to create SemiPartial and SemiRequired. Here's a free one for tuples:
type FixedLengthTuple = L extends 0 ? never[] : Array & { 0: T, length: number }
Been using typescript for a long time and did not know about most of these! 🔥
The wizard of Typescript.
Definitely one of my favorites channels on RUclips, thanks for the great content !
I'll have to watch it like 5 times
Thank you you TypeScript wizard. I wish I had known of these sooner.
I wish there was a plugin for my IDE that would look at what I'm doing and say "There's a built-in utility type that does this, you should use it". Because I forget about some of these
this is where AI could help a lot. Not a copilot, but a little mentor
Mate, these videos are gold dust. Thanks 👍
High quality content. I keep hearing Theo talk about letting TS infer as much as possible for scalability. Would love your take on it considering all the benefits you showcase of explicit typing.
Absolutely - using a utility type lets you _transform_ an existing type instead of redeclaring it. For instance, UserWithoutId can be Omit.
Inference helps keep your code DRY. This is just another kind of inference.
Wow, so much information in a such short period of time,
TIL about the `-readonly` trick to make properties mutable. Cursed syntax? Yes. Black magic? Yes. Shows decoupling between typing and runtime (Object.freeze)? Definitely: a frozen object, even marked as mutable, won't be allowed to be modified at runtime.
Last week I was looking for the partial type I googled and asked chat gpt but didn't get anything, thanks for this
Love this fast paced vids! ❤
One more great video on this channel... quick and useful!
Just to add, Awaited is also nest aware, so you can do `type A = Awaited;` and A will be string.
Awaited correctly emulates the await keyword, which itself also recursively checks if a result in thenable (aka has a then method with compatible call signature) and uses that wait on anything PromiseLike (yes that's a type TS knows too)
@@Mitsunee_ Yep, I always use PromiseLike when I am accepting a Promise as a parameter or returning the value of a method call,
Except for an async function I will return an actual Promise
Great content! Thanks
This is so useful.
You are underrated, sir
i will watch this video an minimum on 999 times. So mutch good information
Thank you for taking the time to make these available - Sadly I missed the value of the Extract - it wasn't clear what it returned as you didn't hover over the type that was created.
I did! At 1:45
Also, thank you very much!
@@mattpocockuk gotcha! thanks for the reply, Matt. It whipped by and I missed what was being examined. Cheers...
with this speed you can explain whole typescript in half an hour. 👍
Thanks again Matt! Great list of useful types 😄
You're absolutely incredible man :D Thanks!
Great videos, i spent hours trying to grab functions parameters!
Epic mate.
Can you do this for the javascript series please. You're a king 👑. Easy to digest
Very very wonderful and insightful🤲🏿❤️ I love these short videos, I learn faster with these instead
Wow!
Thanks!
So clear and concise. Amazing
Wanna mention to anybody who wanna use or is using Excludes or Extracts, they're not type safety(so you can misstypo and rip), if we will try to extract something that doesn't exist or exclude we wont be notified by highlighting in editor and when i was working on my package with types i didnt know why it wasnt type safety, but then i realized why after hovering on extract and excludes. Theyre both the same, but condition is opposite, so i have made my own ones that are type safe by extending etc and they looks like this:
*type TypeSafeExtract = T extends U ? T : never;*
*type TypeSafeExclude = T extends U ? never : T;*
Theyre literally doing the same, but theyre type safe, so if we're trying to do extracts or excludes like this:
*type SomeUnion = "hey" | "hello" | "hi"*
*type CoolType = Extract* - in this case we wont get highlights that "something" doesnt exist, but by using the type that i have made the same way what normal extract or excludes we re getting type safety
Maybe theres a way in tsconfig to make them type safe, but couldnt find anything about it and my mate told me that its not type safe
2:12 You missed the primary use case: To help support developers using commonjs `export =` syntax. You can only export one type in that case.
This really helps devs who are gradually typing a commonjs package with `module.exports =` everywhere.
I definitely wouldn't say that's a primary use case! But it does sound compelling.
I would purchase your courses in very very soon
This was an awesome summary! I'm interested to learn how to use utility classes with generic types. For example, if your function took a callback and you want the return type to be the result of that callback function.
function cachedRequest (callback: F, key: string): ReturnType { ... }
Sorry that is probably gibberish but hope that gets at the idea of what I want to do
this works as long as you constrain type F to what ReturnType expects, the following signature works as you requested: function cachedRequest any> (callback: F, key: string): ReturnType { ... }
Good content. Very useful and no BS
That's a lot of information to process in under 3 minutes 🥵
It's like those peeps who are really good at niche Lodash functions but now with Typescript types
Great my friend
Great and educational video once again!😁
So effing good
Amazing, thanks
This is some good stuff.
Really nice and insightful video. The TS community could really use more “grand wizards” like you to help educate fledgling mages.
While I agree with the sentiment I think the term ‘grand wizard’ may have been permanently ruined by a less favourable group of people
Great 🔥🎉
Awesome as always Matt! Are you based in London, when's your next talk? :)
where is the Parameters type which you wrote on chapters
this made me subscribe
Great
The only video I don't have to speed up
Awesome.
How about Nominated Omit (NOmit), where keys are known in advance
Does typescript include helper functions which perform the runtime transformation of objects which mimic / match the utility types? For example, for Omit is there a similar function '_omit' from something like tslib? I think most people would use destructuring to achieve this for a simple object, but for complex nested objects it might be tricky.
Nope! TypeScript doesn't see that as its job - if TS wanted to add something like that, it would need to wait for it to be available in JS first.
So that’s how I use NonNullable
Why won’t it be ReturnType?
Try it and see!
Thanks
what if you want to extract the function parameter from a library , but it has 4 functions declarations ?
Very usefil! Is there one for arrays?
Thank you wow
Thanks
tysm 😃😍
Great content!! Plz make this videos like 7min so I don’t have to pause😅
Dang I gotta get me that course…
Took me 30 minutes to finish this video
Nice,
what if I have one required prop in object and rest are dynamic ones?
I tried this one:
export interface Route {
path: string;
[subRoute: string]: Route;
}
But it gives an error: "Property 'path' of type 'string' is not assignable to 'string' index type 'Route'". How can I solve this? I need to have subRoute exactly typeof Route. I can add union like this "Route | string" but it breaks the idea of this object
export type Route = {
path: string;
} & {
[subRoute: string]: Route;
}
@@mattpocockuk now when I create object like this one:
export const ROUTES: Record = {
home: {
path: '/',
},
services: {
path: '/services',
},
about: {
path: '/about',
},
features: {
path: '/features',
},
events: {
path: '/events',
event: {
path: '/events/:id',
}
},
}
It gives the error: "Type '{ path: string; }' is not assignable to type 'Route'.
Type '{ path: string; }' is not assignable to type '{ [subRoute: string]: Route; }'.
Property 'path' is incompatible with index signature.
Type 'string' is not assignable to type 'Route'."
@@mxrquez7692 Head to mattpocock.com/discord to get some answers - RUclips comments are awful for code feedback.
Good video but you didn't talk about Record type
I had built some of those by hand in my latest project, just to realize those features already existed '-' so much wasted time.
woox?
واو فيديو رائع
you forgot Excludes
3 years of typescript ignorance resolved in 3 minutes. why couldnt the documentation explain like this
The sound sync is a bit weird I think. Feels like a ghost talking or something.
TS is amazing, i just wish the ecosystem didn't suck so much :(
Ecosystem is great!
I'll like your YT videos since I can't like your paid content.
Wtf 😳
Instead of saying MaybeString, we could call it StringOrNullish.
🫀