0:03 object is another data type in
0:05 typescript which we also have in
0:08 JavaScript but the typescript objects
0:09 are a little bit different from the
0:12 JavaScript objects so in this lecture
0:14 let's learn about typescript
0:17 objects so just like how we create an
0:20 object in JavaScript in the same way in
0:22 typescript also we create the object for
0:25 example let's first create a variable
0:27 let's call it person and to this we are
0:29 going to assign an object and in an
0:32 object we have key value payers so for
0:35 example the person is going to have a
0:37 name let's say name is
0:40 John and the person is also going to
0:43 have an age let's say the current age is
0:47 30 so this is how we create an object in
0:49 JavaScript and in the same way we also
0:51 create the object in
0:54 typescript but in JavaScript so for
0:55 example correctly to this person we have
0:58 assigned this object where we have name
1:01 and age property but in JavaScript
1:03 letter we can go ahead and we can
1:06 reassign this person object with some
1:09 other object where we will have a name
1:14 let's say Mark we will have an age let's
1:17 say 32 so till here you see in
1:19 typescript we are not getting any error
1:22 but as soon as I add one more property
1:24 for example
1:28 gender let's say gender is male you will
1:30 see that we have an error
1:33 here if I hover over this error it says
1:35 object literal may only specify known
1:38 properties and gender does not exist in
1:41 type this object now why do we have this
1:44 error we have this error because if I
1:46 hover over this person this person
1:50 variable you will see that this person
1:52 variable is assigned with an object now
1:54 this object here is not actually an
1:58 object instead it is a type so basically
2:01 here typescript has inferred a type for
2:02 this person variable and what is the
2:05 type the type is this person should be
2:08 an object and in that object we should
2:11 have name and age property so this is
2:13 the type for this person variable all
2:16 right so here when we assigning an
2:17 object there we have name and age
2:21 property it matches this type so that's
2:23 why here we don't have any error and
2:27 this type has been inferred because here
2:28 when we are initializing it with some
2:30 initial value there we only have name
2:34 and age property so based on this object
2:35 the type of this person variable has
2:38 been inferred and types script has
2:40 inferred its type as an object where we
2:42 should have a name and age property
2:44 letter when we are trying to reassign
2:47 this person with another object where we
2:50 also have this gender property this
2:54 structure does not match this type so in
2:56 this type we have only name and age
2:58 property but here when we are trying to
3:00 assign this person person with this
3:02 object where we also have a gender
3:05 property we are getting this error that
3:07 gender is not a known
3:09 property now if we go ahead and if we
3:13 add gender property also and let's say
3:17 gender is female so now the type of this
3:19 person will be inferred as an object and
3:22 in that object it is expecting name age
3:25 and gender property and now this object
3:27 which we are reassigning to this person
3:29 variable there we have name age and
3:33 gender property so this object
3:36 matches this type here and that's why
3:38 now we don't have any error but if I
3:42 remove this gender property in that case
3:45 this type this object will not match
3:47 this type because here it is also
3:50 expecting a gender property so that's
3:53 right now we have an error so in case of
3:56 object also typescript is doing type
3:59 inference but if we want we can also
4:01 specify the type for this person object
4:03 explicitly so for example here I can go
4:05 ahead and I can specify the type of this
4:08 person as object and when we specify the
4:10 type of the person as object in that
4:12 case we can specify any type of object
4:15 to this person variable so you see
4:16 initially we are assigning an object
4:19 where we have name age agender and then
4:21 later we are reassigning it with an
4:23 object where we only have name and age
4:25 and we don't have any error we can also
4:28 specify the type as this where we are
4:31 not specifying any property in that case
4:33 also we are not getting any error so
4:37 this here and object these two are same
4:39 thing but we can also explicitly specify
4:42 the type of this person for that after
4:44 this variable name we can use a colon
4:46 like this then we use a set of curly
4:49 braces and there we specify the property
4:52 name and its type so for example to this
4:54 person we want to assign only those
4:57 objects which has a name property and
5:00 name should be a string value
5:03 and which has an age property and AG
5:06 should be a number value so
5:09 now to this person now we can only
5:11 assign those objects which matches this
5:14 type which has a name property and it is
5:16 storing a string value and which has
5:18 this age property which is storing a
5:21 numeric value so here you see this
5:24 object does not match this type which we
5:27 are explicitly specifying and that's why
5:30 we have this error the gender is not a known
5:31 known
5:34 property and if I remove this gender in
5:36 that case we will not have any error and
5:38 letter also when we are trying to assign
5:40 an object here there also we only have
5:44 name and age property and this matches
5:47 this type which we are specifying here
5:49 and that's why we are not getting any
5:50 error here as
5:54 well okay so we can also specify the
5:57 type for this person the type of the
5:58 object which we want to assign to this
6:01 person variable table like
6:05 this but if we don't explicitly specify
6:08 this and when we initialize this person
6:10 with an object so here we are doing the
6:12 initialization based on this
6:15 initialization typescript will infer the
6:19 type of this person as you can see here
6:21 so it has inferred this type it is an
6:23 object where we should have a name
6:25 property and age property in the name
6:27 property we should be having a string
6:28 value and in the age property we should
6:31 be having a number
6:34 value so here when we are reassigning
6:36 this person with this object where we
6:38 have the name and age property if I
6:41 change this age to string 32 we will
6:45 have an error because if you see the
6:47 type here there for the age property it
6:50 is expecting a numeric value but here we
6:52 are assigning a string value and that's
6:54 why we have this error it says type
6:56 string is not assignable to type
6:59 number so both the property name and and
7:01 the type of value which we are storing
7:03 in that property is
7:06 important now let me remove this line
7:10 from here and let me write a console.log
7:13 statement and let's go ahead and let's
7:15 log this person
7:18 object let's save the file here let's
7:21 compile this .ts
7:23 file and you can see that the person
7:24 object has been logged there we have the
7:27 name property and age property and if I
7:28 try to access let's say the name
7:30 property of the person object that also
7:34 we can do so let's save this file again
7:36 let's compile this app. TS
7:40 file and you see now the value of name
7:41 property of person object has been
7:44 logged here but here if I try to access
7:46 a property which does not exist on this
7:49 person object for example gender
7:52 typescript will quickly give us an error
7:55 but in JavaScript when we try to log
7:57 person. gender it will not give us any
7:59 error even though this gender property
8:01 does not exist on this person object
8:04 JavaScript will not throw any error and
8:06 when we will log a property which does
8:08 not exist on that object it is going to
8:10 log undefined same is the case here as
8:14 well if we compile this typescript code
8:16 it will compile successfully and in the
8:18 JavaScript we will see that we are
8:19 logging person. gender so let me
8:21 actually show you that let's save this
8:25 and let's again compile this app. TS
8:28 file so you see first of all in
8:30 typescript we are getting this error if
8:31 I scroll
8:35 up we have one error and what is the
8:38 error you can see we have an error at
8:41 this line person. gender and you can
8:44 also see the error that property gender
8:48 does not exist on type this type so
8:49 while compiling also we are getting the
8:54 error but the file this app dots file it
8:56 will still get compiled into JavaScript
8:58 code because in JavaScript this is not
9:06 here you see here we have the same code
9:07 and there when we are trying to log
9:10 person. gender we don't have any error
9:12 here even though this gender property
9:14 does not exist on this person object we
9:16 do not see any error here so when we
9:18 will run this program it is going to log
9:20 undefined in the console as you can already
9:21 already
9:24 see so in JavaScript we are not getting any
9:25 any
9:28 error but in typescript we are getting
9:29 an error
9:33 but if I set the type of this person as
9:36 object in that case to this person we
9:38 can assign any type of object in that
9:41 object we can have any properties and we
9:43 saw that with an example previously but
9:46 still we are getting this error for this
9:48 gender now this error is because now on
9:50 this person if I try to access name
9:52 property in that case also we will get
9:54 this error because here we are
9:56 specifying that this person is object
9:59 but that object has which properties
10:02 that we have not specified right this
10:05 object type does not tell what
10:06 properties this person object is going
10:09 to have so typescript also does not know
10:11 whether this person has this name
10:13 property or not and that's why it is
10:15 throwing this error same is the case
10:18 when we use this curly braces in that
10:20 case also same thing is going to happen
10:22 here we are not specifying what
10:24 properties this person object is going
10:26 to have so typescript does not know if
10:27 this person object has this name
10:29 property or not and that's that's why it
10:32 is throwing an error but if we don't
10:35 specify the type here explicitly in that
10:38 case based on the initial value which we
10:40 have assigned to this person typescript
10:42 is going to infer a type for this person
10:45 variable so this person variable is
10:46 going to be an object which should have
10:48 this name and age property name should
10:50 be string and AG should be number so
10:53 based on that it has assigned a type to
10:56 this person variable and in that type in
10:59 that object we have the name property so
11:00 that's why now we are not getting any
11:03 error but if I try to access a property
11:06 which does not exist for example gender
11:09 then we will get an error so this is
11:11 another very important point to
11:14 remember and finally in JavaScript we
11:17 can access a property on an object using
11:19 square bracket notation also so let's
11:21 see if we can do the same thing in
11:24 typescript also so what I want is from
11:27 the person object I want to access its
11:30 age property but this time I want to use
11:31 square bracket
11:34 notation okay if I save the
11:38 changes let's compile the code again for
11:42 that we need to run TSC app. TS so the
11:44 code has been compiled and as you can
11:46 see when we are logging person. name it
11:48 is logging the value of name property
11:50 which is John and when we are using the
11:53 square bracket notation where we want to
11:55 log the value of age property there it
11:58 is logging 30 so we can also use square
12:00 bracket notation in typescript
12:04 also and finally let's also learn how we
12:06 can specify a type explicitly for an
12:10 object when we have nested objects for
12:12 example inside this person let's say I
12:16 also have an address property and this
12:18 address is going to be a nested object
12:21 in there I have the city property which
12:23 is going to store a string value let's
12:27 say London and I'm going to have a
12:29 country property which is again going to
12:31 store a string value and let's say
12:34 country is UK so when we have nested
12:38 objects how we can specify the type of
12:39 that object
12:42 explicitly for that again whenever we
12:44 want to specify a type for a variable or
12:46 for a parameter first of all after that
12:48 variable or after that parameter we need
12:51 to use a colon and here we want to
12:53 specify the type of this person so
12:55 basically in this person variable we
12:58 want to store an object in that object
13:00 we want to have have a name property
13:02 which should be a
13:05 string and then let's use semicolon we
13:07 want to have an age property which
13:08 should store a
13:12 number again let's use semicolon then we
13:15 also want to have an address
13:18 property and in this address property we
13:21 want to store an object so for the
13:23 object we specify a set of curly braces
13:27 like this now in that object we want to
13:30 have a city property which should store
13:35 a string value again let's use semicolon
13:38 and we also want to have a country
13:41 property and that also should store a string
13:42 string
13:47 value so this is how the type of this
13:49 object will look
13:52 like if I remove this type from here so
13:55 let me cut this type from
13:58 here and now if I H over this person
14:01 object object you see that's how the
14:04 type of this person looks like for the
14:07 inner object we have this property to
14:09 which we have assigned an object this
14:11 set of curly braces and there we are
14:13 specifying the property name and the
14:14 type of value which that property is
14:15 going to store
14:17 store
14:20 okay so let me get that
14:24 back so here we are specifying the type
14:28 of the person variable and then here we
14:32 are assigning an object to that person
14:36 and this object matches the type of this person
14:37 person
14:40 variable all right so this is all from
14:42 this lecture if you have any questions
14:44 then feel free to ask it thank you for
