1
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

2
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

3
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

4
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

5
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

6
00:00:34,153 --> 00:00:37,744
for a moment and talk about parallel arrays. A lot of times when you are working

7
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

8
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

9
00:00:46,487 --> 00:00:51,008
database that you are getting that information from or maybe a third party so you

10
00:00:51,008 --> 00:00:54,138
are hitting a web service or something were you are pulling that data back.

11
00:00:54,138 --> 00:00:58,046
Whenever you are working with data and parallel like this you just need to be

12
00:00:58,046 --> 00:01:04,754
careful with your logic, for example I had my first student there in my names, Natasha

13
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

14
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

15
00:01:17,619 --> 00:01:22,295
and Boyd extremely disappointed. So we want to make sure we work things correctly

16
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

17
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

18
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

19
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

20
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

21
00:01:48,185 --> 00:01:53,925
understand how these are working. So we are going to have a variable and use

22
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

23
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

24
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

25
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

26
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

27
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

28
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

29
00:02:37,273 --> 00:02:42,200
contentTable is just stylistic, and then I created a table row with two headers with the

30
00:02:42,200 --> 00:02:47,085
name and exam score so I can add rows and put them in our columns appropriately

31
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

32
00:02:53,386 --> 00:03:00,048
appropriate data. Then in my output variable I simply said go into my document get my

33
00:03:00,048 --> 00:03:07,170
element with an ID with outputTable. So I grabbed that html element of outputTable, that

34
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

35
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

36
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

37
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

38
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

39
00:03:34,977 --> 00:03:38,951
notice I am using, I am hitting, even though I am looping over my scores array

40
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

41
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

42
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

43
00:03:55,393 --> 00:04:01,333
the appropriate html tag intersperse for my cells. So this example is just to show you

44
00:04:01,333 --> 00:04:05,195
how you can go through loop through one array and hit a parallel array at the

45
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

46
00:04:09,223 --> 00:04:14,333
the appropriate information so like in my scenario Boyd is getting the right score

47
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

48
00:04:20,127 --> 00:04:24,765
table. If you have any questions let me know and happy coding!