Isn't the example above obvious enough?
We receive a data prop, and we want to have it typed to receive all the benefits of typescript(auto-completion, etc.). If we hardcode the data, we limit our component to only one data structure. Using generics allows users to install our component and use any data structure they prefer.
Auto-completion is not a TypeScript feature. TS can help, but most of the auto-completion relevant for components isn't really helped by a generic component. Especially if you're just establishing a data prop.
The code has so many flaws despite TypeScript, it's difficult to see how generics could help:
Assuming data is an array of objects without mandating that.
Getting the keys only from the first item of that array...
... but somehow assuming the key needs an explicit toString call and the value is renderable.
The benefits of generics aren't actually shown here either. In fact, even the example at the end doesn't actually use a typed instance of the generic component.
Generics can be useful, if you're mandating a relationship between the types of different arguments/props. For example, say, mandating a { data: T[], render: (T) => Element } prop list.
I agree with you that typescript gives more benefit but at the time if writing GenericComponent data type is still unknonwn and at line 14 you are assuming that value is of type string. Besides saying that your technique is extremely use full if you are passing rendering list as child function. You can pass the data into rendering function where you will have all goodness of typescript (intellisense, compile time check and so on).
Hope its clear, let me know if you need an example.
Isn't the example above obvious enough?
We receive a data prop, and we want to have it typed to receive all the benefits of typescript(auto-completion, etc.). If we hardcode the data, we limit our component to only one data structure. Using generics allows users to install our component and use any data structure they prefer.
data
prop.data
is an array of objects without mandating that.toString
call and the value is renderable.Generics can be useful, if you're mandating a relationship between the types of different arguments/props. For example, say, mandating a
{ data: T[], render: (T) => Element }
prop list.Not going to answer all your comments, but regarding your claim that I am not using a typed instance, please read about Type Inference:
typescriptlang.org/docs/handbook/t...
I agree with you that typescript gives more benefit but at the time if writing
GenericComponent
data type is still unknonwn and at line 14 you are assuming that value is of type string. Besides saying that your technique is extremely use full if you are passing rendering list as child function. You can pass the data into rendering function where you will have all goodness of typescript (intellisense, compile time check and so on).Hope its clear, let me know if you need an example.
I am not sure I fully understood, please share your example. Thanks!