0:03 in this lecture we are going to learn
0:06 about arrays in typescript and how it is
0:08 different from JavaScript arrays arrays
0:11 are basically a collection of values and
0:13 just like in JavaScript we can create an
0:15 array using square brackets in
0:18 typescript also so let's go to vs
0:21 code and here let's first create a
0:23 simple array so I'm going to use this
0:25 let keyword to create this array I'll
0:28 simply call it as person and to this I'm
0:29 going to assign an array for that we can
0:31 use a set of square brackets like this
0:33 and in there we can specify some values
0:35 for example let's say the name of the
0:39 person is John his age is 28 he is also a
0:40 a
0:45 male and then let's say his salary is
0:49 $1,000 okay so here we have created an
0:51 array which can store a value of
0:54 different types now if I hover over this
0:57 person array now you will notice that
1:02 its type is an array of string or number
1:04 that means in this person array we can
1:07 store a value of type either string or
1:10 number that's because the array which we
1:12 are currently assigning to this person
1:15 array it only contain values of type
1:19 string or number so here the typescript
1:21 has inferred the type of this person
1:24 array as an array of string or number
1:27 okay so if I try to push any other type
1:30 of value in this person array using this
1:33 push method for example if I try to push
1:36 true here you see we have an error and
1:39 the error says argument of type Boolean
1:41 is not assignable to parameter of type
1:44 string or number because the type of
1:46 this person array it has been inferred
1:49 as an array of string or number so we
1:51 cannot insert any Boolean value in it we
1:54 can only insert either a string value or
1:56 a number value if I try to insert 28 we
1:58 will not get any error because this
2:01 person array can store a value of number
2:04 typee also it can store a value of
2:08 either string type or number type now if
2:11 I create an array of a single type for
2:12 example let's say I'm creating this
2:14 names array and in this array I'm only
2:22 string so now if I hover over this names
2:24 array you will notice that it is an
2:26 array of type string so this is how we
2:28 specify the type for an array we specify
2:30 the data type and after that we specify
2:33 square brackets which means that that
2:36 variable is basically an array of this
2:39 data type if I create an array of
2:43 numbers let's say birth here and to this
2:46 if I only assign numeric
2:50 values like this so now this array only
2:52 contains numeric values and that's why
2:55 the typescript will infer its type as an
2:57 array of numbers if I go over this birth
3:00 array you will see that this birth array
3:02 it is basically an array of numbers and
3:04 if I try to insert any other type of
3:06 value to this birth year array by using
3:08 this push method let's say here I'm
3:11 trying to push a string value let's say
3:14 hello again we will get an error so this
3:16 hello cannot be inserted inside this
3:18 birth year array because this birth year
3:22 array it is of type number array it can
3:25 only store a numeric value all right so
3:29 this is how typescript infers the type
3:32 of an array when we are storing a single
3:34 type of value in that array then the
3:36 type of that array will be an array of
3:38 that type for example here when we are
3:41 storing only string values the data type
3:44 of this names variable is array of
3:47 string in case of birth here it is array
3:49 of numbers and here for this person
3:51 array when we are specifying value of
3:54 different types in this array in that
3:56 case based on what type of values we
3:58 have in that array its type has been
4:01 inferred in this case this array which
4:03 we assigning to this person variable it
4:05 has only string values and numeric
4:08 values so its type is inferred as string
4:11 or number that means this array can
4:13 store either string values or number
4:16 values all right now during
4:18 initialization if I also specify a
4:20 Boolean value in this array let's say
4:26 true now this array will be an array of
4:28 either string values number values or
4:30 Boolean values because during
4:32 initialization in this array we have
4:35 string values number values and Boolean
4:37 values I hope this point is
4:40 clear we can also set the type of an
4:43 array explicitly for example let's say
4:46 here I simply want to create this
4:48 variable names and what we want is in
4:50 this names variable it should be an
4:52 array and in that array we only want to
4:54 assign string values so we can specify
4:56 it like this we can specify the type of
4:58 this name variable explicitly like this
5:01 and let a we can go ahead and we can
5:03 push string values to it for example I
5:07 can say names. push and I want to push a
5:09 string value
5:13 John okay now here we have an error and
5:15 the error says variable names is used
5:18 before being assigned so what we can do
5:21 is initially we can assign an empty
5:25 array to it like this but if I try to
5:29 insert some other type of value inside
5:31 this names array for example let's say
5:33 if I try to insert a numeric value we
5:36 will get an error because this names it
5:39 is of type string array so we can only
5:41 insert string values inside this names
5:44 array we cannot insert any other type of
5:46 value inside this names
5:49 array then if we want to specify the
5:51 type for this birth here explicitly
5:54 again we can use colon and then in this
5:56 birth year array we want to store only
5:59 numeric values so we can say array of
6:01 number numbers so we will specify the
6:03 data type which is number and after that
6:04 we can use a set of square brackets like
6:08 this so in this birth here now we can
6:13 only insert values of number type and
6:15 for this person array let's say in this
6:17 person array we only want to store
6:21 values of string or number type we don't
6:22 want to store any other type of value
6:24 inside this person so for that we can
6:26 specify its type so again we will use
6:29 colon and there we will specify that
6:31 this person array is going to store a
6:33 value of either string type or number
6:35 type and since we want to specify two
6:38 data types here we will use parenthesis
6:41 like this there we will specify string
6:46 or number so this pipe here it is
6:48 basically used for a data type called
6:51 Union so in typescript we also have a
6:53 union type which we will talk about
6:56 letter in this course but for now just
6:57 understand that when we specify
6:59 something like this there we are telling
7:02 that this variable here it can store a
7:05 value of string or number and after that
7:08 if we specify square bracket like this
7:10 in that case we are saying that in this
7:12 person variable it should be an array
7:13 because we have used a set of square
7:15 brackets here and in that array we can
7:18 only store values of string type or
7:20 number type and here you see we also
7:23 have an error this error is because
7:25 since we have specified the type of this
7:27 person array explicitly to store string
7:30 or number values when we are storing a
7:32 Boolean value here we are getting this
7:34 error if I remove this Boolean value
7:36 from here now we only have string and
7:38 numeric values in this are so now we
7:41 don't have any error all
7:45 right finally if we try to access the
7:47 elements of an array just like in
7:49 JavaScript we can access the elements of
7:52 an array using its index so for example
7:54 from this names array if I want to
7:57 access its first element currently it is
7:58 going to have only one element which is
8:02 John so here if I say
8:05 console.log and if I want to access the
8:07 first element of this names array I can
8:09 say names and then I can specify an
8:12 index which is zero okay so it is going
8:13 to give us the first element from the
8:16 names array and initially this names
8:18 array is empty and after that at this
8:20 line we are pushing one element inside
8:22 this names array so if you save the
8:25 changes here and if we compile this app. TS
8:26 TS
8:29 file you see John is logged here but if
8:32 I say names of one in this names array
8:34 we don't have any second element let's
8:35 save the
8:38 changes and let's compile this app. TS
8:41 file again and you see it is logging
8:43 undefined because we don't have any
8:45 second element inside this names are so
8:47 in that case it is logging undefined in
8:49 the same way we can also access elements
8:51 from this birth year array so let's say
8:52 we want to access the second element
8:54 from this birth year array so for the
8:56 second element the index will be one if
8:58 we save the changes and if we compile
9:00 this .ts
9:03 file 1989 is logged here because the
9:05 second element of this birth year array
9:08 is 1989 so using its index using the
9:11 index of an element we can access its
9:14 value and we can also Loop over an array
9:16 so for looping over an array I'm going
9:19 to use for off Loop so here let's create
9:24 a variable let's call it maybe e off and
9:25 let's say we want to Loop over this
9:27 birth year
9:29 array and what do we want to do
9:33 so for each iteration inside this year
9:35 variable we are going to get the birth
9:37 year value for that element so for the
9:40 first iteration this e variable will
9:43 receive this first element for the
9:44 second iteration this ER variable will
9:46 receive this second element and for the
9:48 third iteration this ear variable will
9:51 receive this third element and let's say
9:53 we simply want to log it in the
9:57 console so here we are going to log e so
9:59 for each iteration we are going to log
10:02 the value stored in this e variable if I
10:05 save the changes and if we compile this
10:07 app. TS file
10:11 again here we should see all these three
10:14 elements logged in the console so 1998
10:18 1989 and 2007 and this 1989 this first
10:20 log is coming from this line let's
10:24 remove it let's see if the changes again
10:26 let's compile app.
10:30 TS and now we should see each element of
10:32 this birth here array logged here so
10:33 basically we are looping over each
10:36 element and for each iteration we
10:38 logging the value of that
10:41 element this is all about arrays in
10:43 typescript we are going to use arrays
10:45 and objects quite often in this course
10:47 so it's very important to understand how
10:51 an object and an array Works in
10:53 typescript this is all from this lecture
10:54 if you have any questions then feel free
10:56 to ask it thank you for listening and
10:58 have a great day
