1
00:00:02,160 --> 00:00:09,180
Let's stick to arrays and objects and no important nice syntax which you'll see a lot in modern javascript

2
00:00:09,180 --> 00:00:14,920
and also types good projects is a ray and object D structuring how does that work.

3
00:00:14,980 --> 00:00:20,830
Well let's start with our array which we got the Hobbes array which gets to Hobbes let's say you want

4
00:00:20,830 --> 00:00:26,110
to extract these two hobbies and store them in variables or constants.

5
00:00:26,380 --> 00:00:34,210
Of course we can do that with Hobby one equal to Hobby one equal hobbies for index 0 which is the first

6
00:00:34,210 --> 00:00:38,760
element and the same maybe with hobby too for hobbies at index 1.

7
00:00:38,770 --> 00:00:43,350
This will pull out these two elements and store them in constants.

8
00:00:43,390 --> 00:00:47,730
It took us two lines of code and the more elements we want to retrieve the more lines of code.

9
00:00:47,740 --> 00:00:53,890
It takes us a radio structuring allows us to shorten that with array D structuring which also works

10
00:00:53,890 --> 00:01:00,040
with let by the way not just with const you add square brackets on the left side of the equal sign which

11
00:01:00,040 --> 00:01:01,440
is an unusual place.

12
00:01:01,450 --> 00:01:02,760
Haven't seen that before.

13
00:01:02,980 --> 00:01:08,110
And on the right side you have the array which you want to d structure now D structure really means

14
00:01:08,110 --> 00:01:13,750
stead you pull elements out of the array and here on the left side between these square brackets you

15
00:01:13,750 --> 00:01:17,240
store them in constants or if you use left in variables.

16
00:01:17,290 --> 00:01:24,490
So here we could then have how we won and hobby too and what the syntax does is it goes through the

17
00:01:24,490 --> 00:01:30,190
Hobbes array takes the first element and stores it in a constant with this name takes the second element

18
00:01:30,310 --> 00:01:38,230
stores is it in a constant with this name you can even add rest parameters here and have remaining Hobbes

19
00:01:38,230 --> 00:01:45,220
here in case do you Hobbes array had more elements than just two then all the remaining elements which

20
00:01:45,220 --> 00:01:51,250
you didn't pull out into a hobby one or hobby two will be stored in a new array called remaining hobbies

21
00:01:51,340 --> 00:01:56,740
so they will be merged together into a new array by the way these structuring does not change to your

22
00:01:56,740 --> 00:02:06,160
original array so if we console log hobbies hobby 1 and hobby to here you will see that Hobbes is still

23
00:02:06,160 --> 00:02:08,880
the old array it's not empty or anything like dead.

24
00:02:08,890 --> 00:02:15,280
So the values which we pulled out in quotes are really just copied into new constants or variables not

25
00:02:15,280 --> 00:02:17,540
really removed from the array.

26
00:02:17,720 --> 00:02:21,700
Now that's a radio structuring we've got the same four objects we got our person here.

27
00:02:21,730 --> 00:02:28,210
Now let's say we want to store name and age in standalone constants or variables just as a radio structuring

28
00:02:28,540 --> 00:02:34,960
object restructuring works with both constant let him go with concept and now we can use curly braces

29
00:02:34,960 --> 00:02:42,810
on the left side of the equals sign although a new syntax I guess and have our object or the variable

30
00:02:42,850 --> 00:02:48,580
pointing at the object on the right side now by the way please note this is not an object type I'm assigning

31
00:02:48,580 --> 00:02:55,000
here I don't have a colon here is read just curly braces like this on the left side without a colon

32
00:02:55,120 --> 00:03:02,620
after some constant name so I'm not assigning the type of the value that could be stored in a constant

33
00:03:02,770 --> 00:03:10,180
I'm really just using a special syntax because here we now also can refer to property names we have

34
00:03:10,180 --> 00:03:18,880
an add object for example name and age to pull the values for these keys out of person and store them

35
00:03:18,880 --> 00:03:26,870
in constants of the same name now here I'm getting errors because at the very top I already have a h

36
00:03:26,870 --> 00:03:32,020
variable and name turns out to be a globally available variable which exists anyways.

37
00:03:33,270 --> 00:03:41,950
So there work around would be to really just use a different key name here first name for example.

38
00:03:41,980 --> 00:03:45,070
And now we can pull out the value by that key here.

39
00:03:45,070 --> 00:03:46,910
So this is how object destruction works.

40
00:03:46,930 --> 00:03:53,350
The important thing here is for a radius structuring elements are pulled out in order because an array

41
00:03:53,350 --> 00:03:56,050
is an ordered list in objects.

42
00:03:56,040 --> 00:04:02,140
The order is not always guaranteed and therefore we don't pull elements out by position but by key name.

43
00:04:02,140 --> 00:04:07,670
So the values or the names you specify here between the curly braces are not arbitrary.

44
00:04:07,690 --> 00:04:09,670
You can't come up with names here.

45
00:04:09,700 --> 00:04:16,840
These have to be property names you find in the object so that the values for these keys can be pulled

46
00:04:16,840 --> 00:04:21,970
out of that object and then they're stored in constants or variables of the same name.

47
00:04:21,970 --> 00:04:26,010
If you would want to override dad name you could do so with a cold in here.

48
00:04:26,020 --> 00:04:28,050
Again it's not a type assignment here.

49
00:04:28,120 --> 00:04:29,700
It just sets and you name.

50
00:04:29,710 --> 00:04:33,850
So this is all javascript syntax has nothing to do with typescript.

51
00:04:33,880 --> 00:04:40,810
So here we could store this in user name consent for example and therefore thereafter we can console

52
00:04:40,810 --> 00:04:49,030
log user name and age but not first name because it basically overrode first name to be named user name

53
00:04:49,210 --> 00:04:52,840
in the constant which we create when we pull out values here.

54
00:04:52,840 --> 00:04:58,390
Age is not overwritten so we can use it like that again does is not a type assignment here.

55
00:04:58,390 --> 00:05:06,610
This is javascript syntax where we alias rename property we're pulling out a person all of Justice before

56
00:05:06,610 --> 00:05:13,210
with the array the person object itself is not changed we really just copy these values out of the object

57
00:05:13,480 --> 00:05:15,490
and therefore we get this output here.