# Making sense of TypeScript generics

DevFeed: [Making sense of TypeScript generics](<https://devfeed.tech/articles/making-sense-of-typescript-generics-20098.md>)

Original publisher: [Read original article](<https://medium.com/jobteaser-dev-team/making-sense-of-typescript-generics-6b830e66eeff?source=rss----bd77d16a0035---4>)

Author: Clément Gateaud

Published: 2024-07-04T16:12:05Z

Content type: tutorial

Language: en

Sources: [JobTeaser](<https://devfeed.tech/sources/jobteaser.md>)

Topics: [TypeScript](<https://devfeed.tech/topics/typescript.md>), [generics](<https://devfeed.tech/topics/generics.md>), [Code](<https://devfeed.tech/topics/code.md>), [Development](<https://devfeed.tech/topics/development.md>)

Tags: [code](<https://devfeed.tech/tags/code.md>), [development](<https://devfeed.tech/tags/development.md>), [errors](<https://devfeed.tech/tags/errors.md>), [generics](<https://devfeed.tech/tags/generics.md>), [generics-in-typescript](<https://devfeed.tech/tags/generics-in-typescript.md>), [type-parameter](<https://devfeed.tech/tags/type-parameter.md>), [type-safety](<https://devfeed.tech/tags/type-safety.md>), [types](<https://devfeed.tech/tags/types.md>), [typescript](<https://devfeed.tech/tags/typescript.md>), [web-development](<https://devfeed.tech/tags/web-development.md>)

## AI overview

This tutorial explains TypeScript generics through a simple JavaScript function that returns the first element of an array. It contrasts generics with using any, explicit lists of possible types, and type assertions, emphasizing improved type inference and type safety.

## Source excerpt

TypeScript significantly improved JavaScript development with enhanced code reliability and maintainability, ensuring fewer runtime errors and greater productivity for developers. But when you start working with it, the syntax can sometimes feel overwhelming. One of the most intimidating features in TypeScript is "generics". Look at the example below 🤯 aren't you afraid ? Types declarations from @tanstack/react-query (library) that can feel overwhelming But don't worry, we will go step by step and once you understand generics, you'll see how powerful they are. The best any alternative Imagine this very simple JavaScript function that returns the first element of an array. (I agree, this function is not very useful, but it's for the sake of explanation). How could we type it? 🤔 What would be the type of the array? Well, in this function it could be an array of anything (a string, a number, an object). So it could be tempting to type it like this, using the type whose name must not be spoken: any 😱 But this is very bad typing. Why? Because TypeScript won't be able to properly infer the return type of this function. So maybe we could specify all the different types it could be? Not a good idea. First, because it would force you to maintain a huge list of all the possible types for this function. But more importantly, because it doesn't solve our inference issue. TypeScript is not smart enough to guess the type when calling the function. So maybe we could use casting with as to help TypeScript? But that's cheating! With this type assertion, you are telling TypeScript: "Stop type checking and trust me, I know what I'm doing". This weakens type safety which is the core purpose of using TypeScript. Don't do that! There's a way safer and cleaner way to type this. Guess how it's named? ✨ Generics✨ Introducing generics Let's keep our previous example. What we want to tell our function is: "You will take as a parameter an array of SOMETHING, and you will return a SOMETHING ele