to reference that type. So how we read this is that we have an interface, which is a box of type T that has a property contents of type T. So whatever type we give in here is going to be the type of the contents. Now, T is the most commonly used symbol or letter to represent generics, but it doesn't have to be a single letter. You can use whatever you want. So we could rename this to contents. We could name it whatever we want. Generally, people use a single letter to be more concise, but there are no restrictions on what this can be. It can be any name you want. So now that we've defined our interface of this box of contents, how do we use this when we define these values? So we have a box of strings, so we know it's going to be a type box. And then we use these angle brackets again, and we just put in the type of the contents here.

these values? So we have a box of strings, so we know it's going to be a type box. And then we use these angle brackets again, and we just put in the type of the contents here. So we have an array of strings. So let's just write an array of strings. And now we have a valid type declaration for this box of strings. It's a box of an array of strings. So the box of string is exactly the same. It's a box, except inside this one, we just have string for our contents and numbers. Our contents is just an array of numbers. And there we go. So I can rename this to whatever I want, and our types are still going to hold up. That's completely fine. Another example you will see a lot when you're looking at generics is this identity function. So we have a function called identity, which takes some parameter X and returns X. And

when you're looking at generics is this identity function. So we have a function called identity, which takes some parameter X and returns X. And how would we generically type this? So we just take something and return it back. We don't do anything else. So when we're typing generic functions, the angle brackets that we see up here, they just go right up hard against the parentheses for the function parameters on the left hand side. So we put our angle brackets here. We're just going to use the symbol T because to be consistent with everything and it's nice and concise. So we have some generic value T and then our X is going to be of type T and we're going to return type T because whatever we get, we're just going to return.

of 2 and then this is going to tell us that it is the number 2. So I don't really find this example all that helpful. I find it's generally more confusing than it helps because the identity function is not something that people use in their day-to-day coding and sometimes even the concept of an identity function just adds unnecessary confusion. So let's have a look at potentially a more realistic example. So let's say we have this function here called randomElement that takes some $xs. So $xs is obviously going to be an array of something. So we're going to take an array. We're going to generate a random index within that array and return whatever value is at the random index of that array. So we want this array to be anything. We don't want to have to type for randomElement of strings, randomElement of numbers, randomElement of

index of that array. So we want this array to be anything. We don't want to have to type for random element of strings, random element of numbers, random element of whatever. We want to just generically type this function to return a random element of whatever we give it. So again, like in our identity function, we go just to the left of the function parameters and we define our generic type. X is going to be an array of this generic type and we're just going to return because we're only returning one element in the array, we're going to return type T. So we have an array of some generic type. We're just going to return a single value of that generic type. So here we've got two examples. We've given an array of strings and an array of numbers. So if we look at the type of const A TypeScript is smart enough to know this is going to be a string. And if we look at B TypeScript is

to know that whatever we give into this function, it's just a generic array. We're going to get any element within that array. So this knows this array has numbers, has numbers and strings. So we're either going to get back number or string. And I could also add an arbitrary object here. So I could give it an ID and some random property. And now if I look at the type of B, it's going to tell us that it's going to be a string or a number or this object we just tacked in. So we could add any arbitrary value inside this array and we're going to get perfect type safety. So that it's not really possible to enumerate all these individual types and declare interfaces for them without the use of generics. So that's what makes generics so powerful. We can also define functions

And then here we're going to do const randomArray = Math.random() < 0.5. Use X if we generate a random number less than 5. So let's say return X, then it's going to be X's. Else it's going to be Y's. Now this is going to give us a type error and let's have a look at this type error. So it says T cannot be instantiated with arbitrary type which could be unrelated to U. So as I said, we always jump down to the end. So this, maybe if you're not familiar with generics, doesn't make sense. So we go up a line, type U is not assignable to type T. T needs to be related to T or U. We just basically see at the top here, T or U is not assignable to type T. So what this is telling us is that this function actually returns T or U