From 678a5338659182ee18175120cc8d8a89fd08b1c0 Mon Sep 17 00:00:00 2001 From: jbranchaud Date: Sat, 17 Dec 2022 12:22:07 -0600 Subject: [PATCH] Add Get The Return Type Of An Async Function as a TypeScript TIL --- README.md | 3 +- ...et-the-return-type-of-an-async-function.md | 47 +++++++++++++++++++ 2 files changed, 49 insertions(+), 1 deletion(-) create mode 100644 typescript/get-the-return-type-of-an-async-function.md diff --git a/README.md b/README.md index f6eb3cd..3c9e8fb 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ pairing with smart people at Hashrocket. For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186). -_1270 TILs and counting..._ +_1271 TILs and counting..._ --- @@ -1181,6 +1181,7 @@ _1270 TILs and counting..._ - [Extract Object Type Keys Into A Union Type](typescript/extract-object-type-keys-into-a-union-type.md) - [Extract Object Type Values Into A Union Type](typescript/extract-object-type-values-into-a-union-type.md) - [Generate Inferred Type From Zod Schema](typescript/generate-inferred-type-from-zod-schema.md) +- [Get The Return Type Of An Async Function](typescript/get-the-return-type-of-an-async-function.md) - [Interfaces With The Same Name Are Merged](typescript/interfaces-with-the-same-name-are-merged.md) - [Narrow The Type Of An Array To Its Values](typescript/narrow-the-type-of-an-array-to-its-values.md) - [Re-Export An Imported Type](typescript/re-export-an-imported-type.md) diff --git a/typescript/get-the-return-type-of-an-async-function.md b/typescript/get-the-return-type-of-an-async-function.md new file mode 100644 index 0000000..cb24cf3 --- /dev/null +++ b/typescript/get-the-return-type-of-an-async-function.md @@ -0,0 +1,47 @@ +# Get The Return Type Of An Async Function + +When working with TypeScript-first libraries like Prisma, you'll be working +with functions that have useful, but complex type signatures. The TypeScript +built-in [Utility +Types](https://www.typescriptlang.org/docs/handbook/utility-types.html) +make a big difference when working with these. + +For instance, a function that makes a couple Prisma calls with join'ed data +will have a large return type that you can't easily recreate with imported +types from the Prisma client. + +Given a function like this, we can start out extracting its return type with +the +[`ReturnType`](https://www.typescriptlang.org/docs/handbook/utility-types.html#returntypetype) +utility type, passing it the `typeof` the function as the generic. + +```typescript +type FuncReturnType = ReturnType +``` + +A function like this is going to be async, so its return type will be wrapped +in a promise. We can "unwrap" the promise with +[`Awaited`](https://www.typescriptlang.org/docs/handbook/utility-types.html#awaitedtype). + +```typescript +type FuncReturnType = ReturnType +type ResolvedFuncReturnType = Awaited +``` + +We are often querying for lists of things, so the result will be an array of +the type we are interested in. We can extract the type of an array with +`[number]`. + +```typescript +type FuncReturnType = ReturnType +type ResolvedFuncReturnType = Awaited +type PostType = ResolvedFuncReturnType[number] +``` + +Putting it all together into a single line looks like this: + +```typescript +type Post = Awaited>[number] +``` + +[source](https://twitter.com/jbrancha/status/1603505456458207232)