In this video we're going to start to discuss a raise in typescript.
As usual we'll start off with the plain definition then walk through some examples and then talk about
why we care about these things and went to use them.
So let's get to it.
First a quick definition.
When we work with the raisin typescript we're essentially working with plain JavaScript arrays.
So we still have all the features that you will are already used to.
We can push elements into an array or pop elements out.
We can map over an array write a for each loop use a for loop all that kind of good stuff.
The one big difference with arrays and typescript is that generally we only stick elements with a very
consistent type into the array.
So for example if we make an array that is supposed to contain strings we will only put strings inside
there.
And if we try to put a number in or a boolean we're going to very quickly get an error message.
So in general when we work with the raisin typescript we're making use of one specific type of element
inside that array.
We can technically put different types of values inside of an array but if we want to do so we have
to be very explicit about it and add in a special little type annotation and we are going to look at
a quick example of how to do that as well.
All right.
So as you might guess it's pretty critical to look at some code samples here.
So that's the only definition we're going to get.
Let's flip on over to our code editor and start writing out a little bit of code.
So back inside my editor I'm going to make a new file inside of my root project directory called arrays
dot T.S. than inside of here.
I'm going to declare an array and just assign it to a variable I'll say const car makers is going to
be an array of strings that has strings like Ford Toyota and Chevy like so if I now hover over that
array right there you'll notice that I have an added on annotation that says that carmakers is going
to be an array of strings.
So this is type inference in action typescript took a look at the value inside this array right here
and it said OK looks like those are all strings.
So I guess carmakers is always going to point out an array that only contains strings.
Now that's type inference doing that for us automatically remember if we wanted to be really explicit
about this we could always put on a colon string and in square brackets like so.
So that's a type invitation that says that this variable is always going to point at an array that contains
nothing but strings we will sometimes want to add in type annotations when we are working with the race.
So the case in which we would want to do that is if we initialize the array as an empty array like so
in this case if we did not have the annotation on here typescript would not have enough information
to understand what type of value was going to be inside that array.
So for example if I now hover over carmakers it says any array and that means we can put any type of
value inside there.
Remember we want to avoid the any type as much as possible.
So if we ever have to initialize an array as an empty array we will add on our annotation it's all put
in string like so otherwise if we're going to initialize our array with some contents already inside
of it then we don't need that annotation All right.
Now we're not limited to just putting basic values inside of arrays.
We can also put complex objects inside as well.
So for example let's try creating a new array here called dates.
And I'm going to be reading an array and assigning it a variety of new Date object instances by now
hover over dates.
Once again it'll tell me that this is going to be an array that contains instances of dates.
Next up we can also write out two dimensional arrays inside of typescript very easily to do so.
We're just going to double up on the syntax around that annotation we put together.
So for example let's say we've got an array called cars by make and I want to have like a 2D array of
strings inside of here.
So inside of the first element of the outer array I'm going to put a new array inside of here.
Then I'll put in like some actual model of car made by say Ford.
So maybe an F1 50 and then at the second index I'll put in a car by taught me car by Toyota which is
a Corolla.
And then finally something by Chevy.
How about a Camaro.
Like so.
So if we now hover over cars by make once again we'll see the type invitation for a two dimensional
array in order to indicate a two dimensional Ray will write out the type of value that goes inside the
inner array.
Then one square bracket and a second square bracket.
So that means that we're going to have an array that contains arrays of strings.
Right there that's the array inner array of string indication right there once again we don't have to
add in that annotation if we don't want to.
The only time we would is if we didn't have any contents in the array when we initialized it.
So in this case we would write out string square brackets great square bracket like so now like I said
when we type in array we're putting on a restriction on what type of value we can put into it.
So let's have a quick pause right here.
When we come back the next video we'll see a very quick example of that.