Now that we've got a basic understanding of what a tuple is, let's try writing a little bit of code
to understand how we work with them in TypeScript.
So back inside my editor, I'm going to make another new file inside my project directory called Tuples
Dots.
And inside, if you're to get started, I'm going to write out an object that looks like that drink
object that we just put together or was inside that diagram, so I'll say can't drink is going to be
an object with a color of brown.
Carbonated is true.
And sugar.
Is up 40 like so so a object works perfectly here, right?
And I can read this and very easily understand what's going on.
However, we have access to tuples as well.
So we could alternatively try to represent this with a tuple to do so.
We could write out, let's say, some new drink here, like maybe Pepsi.
And I'm going to write out what looks like an array.
And I'm basically just going to take the different values out of this object and put them into this
array in a very specific order.
So I'll put in Brown to represent the color then.
True to say that it's carbonated and then 48 to represent the sugar content in this case, like 40 grams,
say here's the only issue.
What we just defined right here is an array.
So if you hover over Pepsi right here, take a look at that type annotation.
This is saying that Pepsi is going to be a string or a number or a boolean array.
So the issue right now is that we could freely swap the order of elements inside of here.
And in general, we don't want to do that because remember, the order inside of a tuple has a very
specific meaning to us.
You and I as developers have to memorize that.
The first element inside of here represents the color and the second element represents carbonation
and the third represents sugar content.
So if you and I start to write out some code that's going to swap the order, like, let's say Pepsi
at zero is now going to be 40 and Pepsi at two is now going to be brown, we have lost information.
So you and I as developers have an assumption about the order of elements inside of here.
And if we start to break that order, our data model completely breaks down.
So we're not going to define this thing as a simple looking array and TypeScript, instead we're going
to add on an annotation to this thing.
This annotation is what's going to turn this line or this array right here into a tuple.
So right after a Pepsi, I'm going to put in a colon.
And then rather than putting out a typewrite here and then square brackets, I'm going to instead put
in a pair of square brackets.
And then inside of here, we're going to write out the specific order of types of elements inside of
this tuple sandwiched right string then boolean then no, like so.
So this is what makes this thing into a tuple as opposed to an array.
We are saying that this array is going to always have a very consistent ordering of elements inside
of it, always a string than a boolean than a number.
So you and I as developers can read this thing right here and understand that there is some meaning
to the order of elements inside of this array looking thing, or I should say tuple.
If we now try to change the order of elements inside of here and say, say, Pepsi at zero is now going
to be 40, will very quickly get an error message, your message is going to tell us that we're trying
to assign a number to an index inside that tuple.
That is supposed to be a string.
So, again, by putting on this different looking type annotation right here, we are turning this array
into a tuple.
An alternate way of writing this thing out right here, rather than putting the type directly in line
as an annotation, would be to create something called a type alias.
We're going to discuss type aliases at great length later on inside this course.
But this is a very good place to use a type alias.
So we're just going to cover them very quickly right now as a quick aside.
So rather than having to repeat out this definition right here, every time we want to create a drink,
we can instead right above right out type and then maybe drink with a capital D and then we'll list
out the tuple structure.
So it's going to be a string boolean and then no.
This does not create an array right here, so no array is being created, instead it's creating the
idea of a tuple inside of our application.
It's a brand new type that we can freely use in any place that we would normally put a type, for example,
in a type annotation.
So now, rather than manually writing out all the different types right here, I could instead say drink
like so, and this is a 100 percent equivalent to what we just had a moment before.
So now I can very easily reuse this tuple structure and say maybe Sprite.
Is also a type of drink, and it will be clear it is carbonated and maybe it also has a lot of sugar
and it may be we also have tea that is a drink, and maybe it's also brown, not carbonated and zero
sugar like so.
So we've now abstracted out the idea of what a drink is into a type alias.
Now we can freely reuse it throughout our application to indicate that each of these different things
are not plenaries.
Instead, they are a tuple that represents a very specific record inside of application.
All right, now, I'm going to be honest with you, we are not going to use tuples very often.
So let's take a quick pause right here.
We're going to come back to the next video.
We're going to discuss why we care about these things and where we're going to use them.
And we're going to find out that maybe tuples are not super useful in TypeScript.
It's a quick pause and I'll see you in just a minute.