Now with that, we're nearing the end and there's just one more type I also want to introduce or one
Typescript feature
I want to introduce and that's the generic types feature.
Now what's that?
Well we already are working with one generic type here.
If we have a look at our results here, we see this is an array, an array full of calculation containers.
Now array turns out to be a type in Typescript which is a so-called generic type,
we could say that results is of type array here but Typescript wouldn't like this
as you see. It tells us that the generic type array, t, whatever that is, requires one type argument.
There are certain values in Javascript as well as in Typescript therefore that simply work together
with other value types and other values and the array is such a value, the array itself is a value, any
array is an object but an array of course only really works because it stores other values,
so we get two types work together, the array and the data in the array and therefore, we want to be clear
that results holds an array but we also want to be clear about which array. Now we could say array any
and use these strange angled brackets to connect these two types.
We have an array and what's in the array is anything but we can also be more precise and say it's an
array of calculation containers and in the end what we used before, calculation container with square
brackets thereafter, is just syntactic sugar for this notation here, where we use the generic
array type to be very precise about the type of data inside of it and there are other generic types
in Typescript as well,
for example the promise type. If you have a promise, for example because you're using the fetch API to
make a HttpRequest, then of course you have a promise as a return type but that promise will
eventually resolve a value and that value will also be of a type,
so a promise is another example of two types working together.
We have the promise type and the promise will give us another type of data,
therefore a promise is another generic type in Typescript, just like array,
it's the combination of multiple types and you can also build your own generic types if you have something
like this.
If we have a very simple dummy function, maybe at the very bottom here, logAndEcho which doesn't do
much but which gets a value and which then logs the value and returns it,
then this could be a generic function.
Now here we accept any type of data you could say
but then we don't get any extra Typescript support.
If I call logAndEcho and pass in hi there, then I know logAndEcho returns what I passed in there and
that's a string
so I would like to do string stuff with it like split it but I can't do that.
Why can't I do that?
Because Typescript doesn't know what logAndEcho returns, it returns anything because I set the value type
to anything here. So that's where generic types can help us,
we can create a generic function in this case,
you can also have generic classes and objects but here we can build a generic function.
We do that by adding angled brackets after logAndEcho, so before the parameter list and then typically
you use t as a placeholder for the type but you can use any identifier you want but t is what you'd
see most often and then you say val is also of type t and what you're saying with that is whoever calls
logAndEcho should give me the precise, the exact type of data he wants to work with and then I know
that I will get an argument of this type and you can use that generic type anywhere in the function,
either for the parameters or inside of that function body, wherever you need it
and here when I call logAndEcho, I can now make it clear that I pass in a string here and now I get
nice auto completion if I for example want to split the result or whatever I want to do.
So that's how I can build my own generic function in this case.
Now as I said, you can also build your own generic classes and so on but this would now lead a bit too
far,
there is way more you can do with Typescript but this is only meant to be an introduction which gets
you to think about Typescript and gets you introduced to some of the core features which you then will
see throughout
other projects you're working on or which you will then see once you dive deeply into Typescript.
So these are generic types, they're everywhere,
there are built-in generic types like array and promise and you can also build your own ones.