1 00:00:02,210 --> 00:00:07,890 Let's get started with the structuring based on my own definition. 2 00:00:07,910 --> 00:00:14,750 I regard this structuring as a way of unpacking a box or a container. 3 00:00:15,290 --> 00:00:22,940 When you unpack a box or a container, it means that you are taking what you want out from the box. 4 00:00:23,150 --> 00:00:30,050 So in short, disruption is a way to extract data from arrays and objects. 5 00:00:30,200 --> 00:00:32,090 So let's see with real code. 6 00:00:32,090 --> 00:00:34,310 So back to visuals to the code. 7 00:00:34,520 --> 00:00:43,460 I have already created a folder called is six and inside I have two files my a html and my JavaScript 8 00:00:43,460 --> 00:00:43,910 file. 9 00:00:44,150 --> 00:00:49,250 So inside my HTML, I have connected my JavaScript file as that. 10 00:00:49,250 --> 00:00:53,510 So now let's make our hands dirty with its features. 11 00:00:53,510 --> 00:00:57,770 And the first one you talk about is called the structuring. 12 00:00:58,680 --> 00:01:00,330 In this particular video. 13 00:01:00,330 --> 00:01:04,920 Let's get started with a rain destruction. 14 00:01:06,310 --> 00:01:07,570 De structuring. 15 00:01:08,200 --> 00:01:12,370 Let's say this is our array with these values. 16 00:01:12,370 --> 00:01:16,150 One, two, three, four and five. 17 00:01:16,540 --> 00:01:17,380 So. 18 00:01:18,340 --> 00:01:21,460 Let's say that we want to retrieve the first value. 19 00:01:21,460 --> 00:01:25,510 That is one we can use the index of to retrieve that. 20 00:01:25,510 --> 00:01:31,060 What we need to do is I'll bring in my variable mine square bracket and add the first index and I think 21 00:01:31,060 --> 00:01:32,710 it will give me one. 22 00:01:32,800 --> 00:01:35,170 Okay, so let's prove it inside the console. 23 00:01:35,230 --> 00:01:37,030 So back to my console here. 24 00:01:37,040 --> 00:01:37,870 Let's open it. 25 00:01:38,000 --> 00:01:47,560 Now, let's try to retrieve the first index zero and then mine is that I get one. 26 00:01:48,190 --> 00:01:55,540 If I want the second value and change this 1 to 1, I'll get a second value, which is two. 27 00:01:55,570 --> 00:01:57,120 The same thing applies to two. 28 00:01:57,130 --> 00:02:00,070 I will get the value of three inside here. 29 00:02:00,100 --> 00:02:07,720 There is nothing new until this point, but there is a better way of doing this than using the index 30 00:02:07,990 --> 00:02:08,830 and a square bracket. 31 00:02:08,830 --> 00:02:11,650 That is where the destruction comes into play. 32 00:02:12,010 --> 00:02:13,180 So that's how are going to do so. 33 00:02:13,180 --> 00:02:23,350 Let's say that I want to retrieve these values or what I need to do is bring mine cost and then my square 34 00:02:23,350 --> 00:02:27,190 bracket is equal to the array. 35 00:02:27,190 --> 00:02:28,000 Perfect. 36 00:02:28,150 --> 00:02:33,430 So now for this one, because I have how many values I have one, two, three, four, five. 37 00:02:33,460 --> 00:02:36,610 So I can represent anything which represents these values. 38 00:02:36,610 --> 00:02:43,210 I can say it can be A, B, C and D with this one. 39 00:02:43,570 --> 00:02:51,730 So if I want the first the first one, A represents one, B represent two and C and as that. 40 00:02:51,730 --> 00:03:02,080 So in my console, if I make use of a C that I get one, if I make use of B, I get to see I get three, 41 00:03:02,260 --> 00:03:03,970 D, I get four. 42 00:03:04,270 --> 00:03:06,460 And then what about let me add one more in the mix. 43 00:03:06,460 --> 00:03:09,520 Let's say E and then F. 44 00:03:09,700 --> 00:03:10,150 Good. 45 00:03:10,150 --> 00:03:16,570 So now let's retrieve I mean, E also E, which is five perfect. 46 00:03:16,570 --> 00:03:18,160 And then what about F? 47 00:03:18,460 --> 00:03:22,120 Well, undefined because it doesn't exist. 48 00:03:22,120 --> 00:03:24,280 Because we have how many records we have. 49 00:03:24,280 --> 00:03:26,410 One, two, three, four, five. 50 00:03:26,410 --> 00:03:28,890 And now here we have how many destruction data here? 51 00:03:28,900 --> 00:03:31,180 One, two, three, four, five, six. 52 00:03:31,180 --> 00:03:35,230 So there is no value for this for this one. 53 00:03:35,230 --> 00:03:37,420 The arrangement model a lot. 54 00:03:37,420 --> 00:03:39,580 So the first one represent this first one. 55 00:03:39,640 --> 00:03:41,530 Second one, we can use any name here. 56 00:03:41,530 --> 00:03:48,430 We can make it as number one or here as number two or here as what? 57 00:03:48,430 --> 00:03:51,130 Let's say number four. 58 00:03:51,130 --> 00:03:59,200 And then in my three here and let's say this, I'm going to be as number four and then this one as number 59 00:03:59,200 --> 00:03:59,710 five. 60 00:03:59,710 --> 00:04:00,240 It is simple. 61 00:04:00,250 --> 00:04:05,080 You can use any variable to represent the data in the array. 62 00:04:05,410 --> 00:04:11,380 So the same thing, we can have arrays of objects and then we get back into that very soon. 63 00:04:11,380 --> 00:04:14,840 So let's have some arrays of objects and let's see. 64 00:04:14,860 --> 00:04:22,570 So let's say that I have this const and let's say users as that and inside my array I can add the first 65 00:04:22,570 --> 00:04:28,210 object, I can say let me add my equal sign here and inside. 66 00:04:28,210 --> 00:04:30,430 Let's say I have the name. 67 00:04:30,430 --> 00:04:33,370 Let me say the user name. 68 00:04:34,290 --> 00:04:36,030 Let's say it's Ben. 69 00:04:36,420 --> 00:04:42,450 And then let's say the age of this particular user is, let's say 20. 70 00:04:42,870 --> 00:04:44,340 I have my first user. 71 00:04:44,340 --> 00:04:45,450 So let me. 72 00:04:46,350 --> 00:04:51,330 Have some room here so I can copy this one and then paste it here. 73 00:04:52,200 --> 00:04:56,640 And I have is to when I be as John. 74 00:04:57,380 --> 00:04:59,390 And the age is 30. 75 00:04:59,750 --> 00:05:00,230 Yes. 76 00:05:00,230 --> 00:05:03,650 So for this one too, I can structure it easily. 77 00:05:03,740 --> 00:05:10,700 So if I want the first user, I make use of users and then my square bracket and then the first in this 78 00:05:10,700 --> 00:05:12,380 one to retrieve the first user. 79 00:05:12,380 --> 00:05:15,290 So let's see it inside the console here. 80 00:05:15,890 --> 00:05:16,600 Okay. 81 00:05:16,610 --> 00:05:25,820 So now if I make this of users and then I get all the array if I want the first one square bracket zero 82 00:05:25,910 --> 00:05:29,660 as that I get the first one with destruction. 83 00:05:29,690 --> 00:05:31,190 Is going to make our life easier. 84 00:05:31,190 --> 00:05:37,610 So I'll bring in const my array and then the original array. 85 00:05:37,610 --> 00:05:44,750 So in here I can say I'm going to be as user one and let's say user two as that. 86 00:05:44,750 --> 00:05:54,680 So inside my console, if I make use of user one, I get as before user two as that's that is about 87 00:05:54,680 --> 00:05:56,930 how we can this structure array. 88 00:05:57,170 --> 00:06:02,000 The next video you will see how we can do structure object.