WEBVTT 00:00:10.950 --> 00:00:16.240 Hello and welcome to 6.2 lab 3 let's go ahead and dive in! Open this file and your js 00:00:16.240 --> 00:00:20.805 file like usual, and let's look at what we're going to do here. We are going to create a 00:00:20.805 --> 00:00:25.979 function lab62_3 function and we are going to create two array variables this is were we 00:00:25.979 --> 00:00:29.887 are going to deal with parallel arrays, and so you can just copy and paste this code in 00:00:29.887 --> 00:00:34.153 here so you don't have to retype everything. Now one thing, let me just take a side step 00:00:34.153 --> 00:00:37.744 for a moment and talk about parallel arrays. A lot of times when you are working 00:00:37.744 --> 00:00:42.178 on an application you are not going to type it or hard code it in like this. A lot of times 00:00:42.178 --> 00:00:46.487 the data you are going to receive is going to come from some other source like a 00:00:46.487 --> 00:00:51.008 database that you are getting that information from or maybe a third party so you 00:00:51.008 --> 00:00:54.138 are hitting a web service or something were you are pulling that data back. 00:00:54.138 --> 00:00:58.046 Whenever you are working with data and parallel like this you just need to be 00:00:58.046 --> 00:01:04.754 careful with your logic, for example I had my first student there in my names, Natasha 00:01:04.754 --> 00:01:12.356 Peeks and her score is a 76, Boyd, he has a 99. We wouldn't want to mess that up 00:01:12.356 --> 00:01:17.619 were Natasha now as a 99 and Boyd as a 76 or Natasha will be extremely happy 00:01:17.619 --> 00:01:22.295 and Boyd extremely disappointed. So we want to make sure we work things correctly 00:01:22.295 --> 00:01:27.183 when we are working with parallel data, in fact a lot of times what I'll do is if I am getting 00:01:27.183 --> 00:01:34.144 this from a database I may lump it into 1 2 dimensional ray and that way I am hitting 00:01:34.144 --> 00:01:38.823 one array and I am lumping that stuff together or I use a j son object where I have an 00:01:38.823 --> 00:01:44.604 object of Boyd and he has a property of 99, that sort of thing. But sometimes you will 00:01:44.604 --> 00:01:48.185 work with parallel arrays like this and I just want to go through this with you so you 00:01:48.185 --> 00:01:53.925 understand how these are working. So we are going to have a variable and use 00:01:53.925 --> 00:01:59.486 the get by ID to get are table. And then we are going to have a look looking for scores 00:01:59.486 --> 00:02:04.208 88 or above. When we hit that, we are going to output the students name and table row 00:02:04.208 --> 00:02:09.344 and I have an example of arrays you can click on here to see some information on it 00:02:09.344 --> 00:02:16.635 so if you need to take a look at that feel free. Now let's just check the output here, and 00:02:16.635 --> 00:02:23.673 the example I have, I am going to have all those names listed if they have 88 or 00:02:23.673 --> 00:02:31.822 above. So let's take a look at how we are going to do this, so in our html in our output 00:02:31.822 --> 00:02:37.273 div I have a table were I have an ID of outputTable so I can grab it, the class of the 00:02:37.273 --> 00:02:42.200 contentTable is just stylistic, and then I created a table row with two headers with the 00:02:42.200 --> 00:02:47.085 name and exam score so I can add rows and put them in our columns appropriately 00:02:47.085 --> 00:02:53.386 so then in my function I have a scores variable, and I have a names variable with the 00:02:53.386 --> 00:03:00.048 appropriate data. Then in my output variable I simply said go into my document get my 00:03:00.048 --> 00:03:07.170 element with an ID with outputTable. So I grabbed that html element of outputTable, that 00:03:07.170 --> 00:03:11.617 table tag and dumped it in my output variable so now I have a hold on that. And then I 00:03:11.617 --> 00:03:17.263 am just doing a loop. So in my loop here I am looping through my scores, starting at 76 00:03:17.263 --> 00:03:21.695 and going all the way through to 79 just a normal for loop and I am just testing it 00:03:21.695 --> 00:03:28.620 is my score greater than or equal to 88? if it is, then I am saying ok I want to compound 00:03:28.620 --> 00:03:34.977 add to my table, a table with a table row with a table data cell with names and 00:03:34.977 --> 00:03:38.951 notice I am using, I am hitting, even though I am looping over my scores array 00:03:38.951 --> 00:03:43.752 I am hitting my names array and using the same i variable to make sure I pull out 00:03:43.752 --> 00:03:50.189 the exact same. So if I am pulling out 99 here I want to pull out Boyd, so that is why 00:03:50.189 --> 00:03:55.393 I am using my names bracket notation there and then I am pulling out the scores with 00:03:55.393 --> 00:04:01.333 the appropriate html tag intersperse for my cells. So this example is just to show you 00:04:01.333 --> 00:04:05.195 how you can go through loop through one array and hit a parallel array at the 00:04:05.195 --> 00:04:09.223 same time, you just got to be careful you are doing it correctly so that you pull out 00:04:09.223 --> 00:04:14.333 the appropriate information so like in my scenario Boyd is getting the right score 00:04:14.333 --> 00:04:20.127 and not Natasha who did not earn her 99 so if you do that correctly you will get that 00:04:20.127 --> 00:04:24.765 table. If you have any questions let me know and happy coding!